2025年数组方法findindex（数组方法filter）

编程日记 • 2025-03-03 17:11 • 阅读 16

ES6提供了很多新的API，数组对象的尤为实用，但是如果我们没有在相对应的开发环境下，很难对这些API有深入的了解，毕竟实践出真知。

find、filter、findIndex这三个方法都是对于数组的查找，其中返回的值略微相关，所以在这里做一个介绍。

这是一个数组原型上的方法，调用格式应该是使用数组对象来调用，该方法接收一个回调函数callback，如：array.find(callback)。
find方法用途是查找符合条件的第一个数组元素。
例子：

如果找不到，返回undefined，
例子：

很显然，这个方法比较适合用来判断数组内是否包含某种条件的值的元素。
或者进一步扩展，查找json数组内包含某个值的对象。如下：

作为原型上的方法，调用和参数与find相同。
顾名思义，这个对比find方法，这个方法返回的是符合条件的元素的下标index。
例子：

如果找不到，返回-1，这点类似字符串查找的indexOf或者正则表达式的search，总而言之，无论什么查找方法，找不到就是-1.
例子：

很显然，这个方法更适合用来判断数组内是否包含某种条件的值的元素。

作为原型上的方法，调用和参数如上。
filter方法，意思为过滤，同样接收一个回调函数callback，该方法的使用场景是查找数组内符合指定条件的所有元素。
例子：

该方法返回的是一个集合，即数组如果找不到，返回空数组[]。
例子：

这三个方法，都是对数组元素的查找，find返回第一个符合的元素的值，findIndex返回第一个符合的元素的下标，filter返回符合的元素的集合。
这三个方法都不会改变原数组的值，具有很大的相同点，所以在这里统一介绍。
相关链接 MDN web docs – Array