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() 傳回一個空數組；

【相關推薦：javascript影片教學、web前端】

以上是es6中find和filter有什麼差別的詳細內容。更多資訊請關注PHP中文網其他相關文章！