像专业人士一样过滤数组

这篇文章最初发表在我的网站上

过滤数组是 JavaScript 开发人员最常做的事情，我知道
过滤原始数据类型或从数组中删除数组或对象有时会很麻烦，但我将向你展示一些
我在尝试使用 js 时发现的很酷的技巧，让我们开始吧

为了像PRO一样过滤数组，我们将使用Array.prototype.filter()方法。

让我告诉你，这些只是我发现的黑客手段，我不知道它们是否适合生产应用程序的良好用例。

删除虚假值

使用这个简单的小技巧，从数组中删除虚假值变得更加简单。

const arr = [undefined, null, 0, '', 'str', 2.5, 2, { a: 1 }, []];
arr.filter(Boolean);
// -> ["str", 2.5, 2, { a: 1 }, []]

过滤数字

使用isFinite函数，我们可以从数组中过滤数字。

const arr = [undefined, null, 'str', 0, 1, 1.5, -2, 5, {}, []];
arr.filter(isFinite);
// -> [null, 0, 1, 1.5, -2, 5]

现在出现了javascript 的奇怪之处，如果使用全局 isFinite 方法，那么数组null也包含该值，但是如果使用Number.isFinite，它将排除 null。

现在你会说为什么？我们不能这样做吗filter(i => typeof i === 'number')？

是的！我们可以，但这不是你来这里的主要原因，你来这里是因为你想了解一些技巧，对吧？

过滤安全整数

通过传递Number.isSafeInteger，我们可以从数组中过滤出安全整数。

请注意，Number.isSafeInteger 还会删除floating-point大于的数字和数字
Number.MAX_SAFE_INTEGER

const arr = [null, 's', {}, 0, 1, 1.5, -2, 1, Number.MAX_SAFE_INTEGER + 1];
arr.filter(Number.isSafeInteger);
// -> [0, 1, -2, 5]

过滤 NaN

使用isNaN函数，我们可以从数组中过滤掉所有内容Numbers，最终只留下其他元素。

注意：
这null是一个特殊情况

const arr = [undefined, null, 0, 's', 1.1, 50, { a: 'b' }, [1, 2]];
arr.filter(isNaN);
// -> [undefined, 's', { a: 'b' }, [1, 2]]

因为这样做isNaN([1])是false这样的：

[[1], [2, 3]].filter(isNaN);
// -> [[2, 3]]

将会回归[[2, 3]]

您还可以尝试以下方法：

• 解析浮点数（）
• 解析Int()

仅过滤数组

使用Array.isArray方法，我们可以从数组中提取数组。（这太拗口了😂）

const arr = [undefined, null, 0, 'str', 1, { a: 'b' }, [5, 6], [{ a: 5 }]];
arr.filter(Array.isArray);
// -> [[5,6], [{a: 5}]]

过滤对象、数组、函数、类

这个方法可能比其他方法更独特。Object.isExtensible ()方法判断一个对象是否可
扩展（是否可以添加新属性）。

通过这个，我们可以过滤可Arrays, Objects, Functions, Classes扩展的元素。

const MyFunc = () => {};
class MyClass {}

const arr = [null, 0, 'str', 1.5, 5, { a: 'b' }, [1], MyFunc, MyClass];
arr.filter(Object.isExtensible);
// -> [{a: "b"}, [1], () => {}, class MyClass]

您还可以尝试以下方法：

• 对象被冻结
• 对象密封

好了，到这里就结束了。希望你喜欢这些很酷的过滤小技巧，并且学到一两招。

现在，正如我之前所说的，这些只是一些技巧和窍门，可以用来让你作为开发人员的生活更轻松，但我不认为在现实世界中使用它们是一个好主意，因为它（可能）会中断。

无论如何，希望你喜欢这个，现在你也是过滤数组的专业人士了！😉。

并且不要忘记评论您最喜欢的数组技巧和窍门，并让我知道您对这些技巧的想法。

封面图片由nate_dumlao提供