es6中find和filter有哪些区别

这篇“es6中find和filter有哪些区别”文章的知识点大部分人都不太理解，所以小编给大家总结了以下内容，内容详细，步骤清晰，具有一定的借鉴价值，希望大家阅读完这篇文章能有所收获，下面我们一起来看看这篇“es6中find和filter有哪些区别”文章吧。

es6中find和filter的区别：1、在不改变数组的情况下查找数组内符合条件的内容时，find方法返回的结果是对象，filter方法返回的结果是数组；2、若没有值满足测试函数，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() 返回一个空数组；

以上就是关于“es6中find和filter有哪些区别”这篇文章的内容，相信大家都有了一定的了解，希望小编分享的内容对大家有帮助，若想了解更多相关的知识内容，请关注亿速云行业资讯频道。