es6中find和filter有什么区别

本教程操作环境：windows10系统、ECMAScript 6.0版、Dell G3电脑。

es6中find和filter有什么区别

1. find 和 filter 都是不改变原数组的方法，都是在不改变数组的情况下查找数组内符合条件的内容，区别是find返回的是对象，filter返回的是数组。

示例如下：

const list = [{'name':'1',index:1},{'name':'2'},{'name':'1'}]
let list2 = list.find(i=>i.name==='1') 
let list3 = list.filter(i=>i.name==='1')
console.log(list); [ { name: '1', index: 1 }, { name: '2' }, { name: '1' } ]
console.log(list2); { name: '1', index: 1 }
console.log(list3);[ { name: '1', index: 1 }, { name: '1' } ]

登录后复制

find只查出第一个符合条件的结果，像例子里是直接返回了一个对象而不是数组！，而filter返回全部结果仍然是数组。

注意：find()找到第一个元素后就不会在遍历其后面的元素,所以如果数组中有两个相同的元素，他只会找到第一个，第二个将不会再遍历了。

2. 综上来看find的查询效率更高一些，所以在数组的中的数据唯一的话最好使用find

find()

ES6 find() 方法返回通过测试函数的第一个元素的值。如果没有值满足测试函数，则返回 undefined。

语法

以下语法中使用的箭头函数。

find((element) => { /* ... */ } )
find((element, index) => { /* ... */ } )
find((element, index, array) => { /* ... */ } )

登录后复制

filter()

filter() 方法创建一个包含所有通过测试函数的元素的新数组。如果没有元素满足测试函数，则返回一个空数组。

语法

filter((element) => { /* ... */ } )
filter((element, index) => { /* ... */ } )
filter((element, index, array) => { /* ... */ } )

登录后复制

共点

高阶函数：这两个函数都是高阶函数。

区别

1、通过一个测试功能

find() 返回第一个元素。

filter() 返回一个包含所有通过测试函数的元素的新数组。

2、如果没有值满足测试函数

find() 返回未定义；

filter() 返回一个空数组；

【相关推荐：javascript视频教程、web前端】

以上就是es6中find和filter有什么区别的详细内容，更多请关注Work网其它相关文章！