在前端开发中，我们经常需要对数组进行过滤，以根据某些条件筛选出符合要求的元素，这时候常常使用 Array.filter() 方法。ES6/7/8/9/10 中不断增强的 Array.filter() 方法可以帮助我们更加方便地进行数组过滤。本文将介绍如何使用 ES6/7/8/9/10 中的 Array.filter() 方法来过滤数组，并提供一些示例代码，以便读者更好地理解。
基本语法
Array.filter() 方法的基本语法如下：
----------------------------- ------- ---------- ---------
其中，callback 是一个用来测试数组中的每个元素的函数，它通过返回一个布尔值来表示元素是否符合条件。需要注意的是，callback 函数接收三个参数：
- element：表示当前正在测试的元素。
- index（可选）：表示当前元素的索引。
- array（可选）：表示原数组本身。
此外，还可以使用可选的 thisArg 参数来指定 callback 函数中 this 的指向。
另外，需要注意的是，Array.filter() 方法并不会改变原数组，而是返回一个新的数组，其中包含符合条件的元素。
常见用法与示例
下面我们将介绍一些常见的用法，并提供相应的示例代码。
过滤数组中的特定元素
如果我们想要过滤数组中的特定元素，可以很容易地使用 Array.filter() 方法来实现。例如，以下代码将过滤出数组中所有的偶数：
----- --- - --- -- -- -- -- --- ----- ------- - --------------- -- ---- - - --- --- --------------------- -- --- -- --
过滤数组中的空值
有时候我们需要过滤掉数组中的空值或 undefined 值，以下是一种常见的用法：
----- --- - --- ----- ---------- --- -------- - -- -- -- ----- ----- ----------- - --------------- -- -------- ------------------------- -- --- -------- - -- --
过滤数组中的重复元素
如果我们需要过滤数组中的重复元素，可以使用以下方法：
----- --- - --- -- -- -- -- -- --- ----- --------- - ----------------- ------ ------ -- ------------------- --- ------- ----------------------- -- --- -- -- -- --
过滤数组中长度大于某个值的元素
如果我们需要过滤数组中长度大于某个值的元素，可以使用以下方法：
----- --- - --------- --------- --------- ------- --------- ----- ----------- - --------------- -- ----------- - --- ------------------------- -- ---------- ---------
根据对象的某个属性查询元素
如果我们有一个包含多个对象的数组，并且需要根据对象的某个属性查询元素，可以使用以下方法：
----- --- - - - ----- -------- ---- -- -- - ----- ------ ---- -- -- - ----- ---------- ---- -- -- - ----- -------- ---- -- -- -- ----- ----------- - --------------- -- -------- - ---- ------------------------- -- -- ----- ---------- ---- -- -- - ----- -------- ---- -- --
结合 map() 方法实现链式调用
在实际开发中，我们往往需要在过滤之后进行进一步的操作，如对过滤后的成员进行计算、映射等操作，我们可以使用 map() 方法来实现链式调用。例如，以下代码将过滤掉一个数组中小于 3 的元素，并对剩余的元素进行平方计算：
----- --- - --- -- -- -- --- ----- ----------- - --------------- -- ---- -- ----------- -- ---- - ------ ------------------------- -- --- --- ---
总结
本文介绍了如何使用 ES6/7/8/9/10 中的 Array.filter() 方法来过滤数组，并提供了一些常见用法和相应的示例代码。如果您在实际开发中遇到了数组过滤的问题，不妨试试使用 Array.filter() 方法来解决，相信会为您带来不少的便利。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6467143e968c7c53b077c24b