還記得我們用到死的for循環(huán)嗎 ?
有時候for循環(huán)是真的很耗性能不說 , 而且要寫一堆代碼 , 代碼冗余 ..
這里推薦大家?guī)讉€特別好用的數(shù)組的方法 , 再不用for循環(huán) , 一句話搞定!~~

1.filter()

創(chuàng)建一個新的數(shù)組，新數(shù)組中的元素是通過檢查指定數(shù)組中符合條件的所有元素。
注意?? :
1.filter() 不會對空數(shù)組進行檢測。
2.filter() 不會改變原始數(shù)組。

array.filter(function(currentValue,index,arr), thisValue)

filter().png

const arr = [34, 65, 87, 48, 99];
// filter() 方法
const arrNew = arr.filter(num => {
    return num >= 66;
});
console.log(arrNew); // [ 87, 99 ]

filter()會幫我們返回數(shù)組中所有符合條件的元素.此時不用在for循環(huán)了.

2.find()

方法返回通過測試（函數(shù)內(nèi)判斷）的數(shù)組的第一個元素的值。
注意?? :
1.find() 對于空數(shù)組，函數(shù)是不會執(zhí)行的。
2.find() 并沒有改變數(shù)組的原始值。
執(zhí)行過程如下 :
1.數(shù)組中的每個元素都調(diào)用一次函數(shù)執(zhí)行
2.當數(shù)組中的元素在測試條件時返回 true 時, find() 返回符合條件的元素，之后的值不會再調(diào)用執(zhí)行函數(shù)。
3.如果沒有符合條件的元素返回 undefined

array.find(function(currentValue, index, arr),thisValue)

find().png

const arr = [34, 65, 87, 48, 99];
// find() 方法
const arrNew = arr.find(num => {
    return num >= 66;
});
console.log(arrNew); // 87

所以 , 我們可以總結(jié)一下 filter() 和 find():

1. 它們對于空數(shù)組都不會執(zhí)行 , 會返回undefined
2. 不改變原數(shù)組
3. 它們的區(qū)別就是 filter()方法 會返回所有符合條件的元素 , 并創(chuàng)建一個新數(shù)組 ,
   但是find()方法只會返回符合條件的一個元素

3.map()

返回一個新數(shù)組，數(shù)組中的元素為原始數(shù)組元素調(diào)用函數(shù)處理后的值。
注意?? :
1.map() 不會對空數(shù)組進行檢測。
2.map() 不會改變原始數(shù)組。

array.map(function(currentValue,index,arr), thisValue)

map().png

const arr = [1, 3, 4, 5];
const res = arr.map((num)=>{
    return num * num;
})
console.log(res) // [ 1, 9, 16, 25 ]

map()方法 返回一個新數(shù)組，數(shù)組中的元素為原始數(shù)組元素調(diào)用函數(shù)處理后的值。

4.forEach()

用于調(diào)用數(shù)組的每個元素，并將元素傳遞給回調(diào)函數(shù)。
注意??:
forEach() 對于空數(shù)組是不會執(zhí)行回調(diào)函數(shù)的。

array.forEach(function(currentValue, index, arr), thisValue)

forEach().png

const arr = [1, 2, 3, 4]
arr.forEach(val =>{
    console.log(val)
}) // 1  2  3  4

所有 forEach()方法可以拿到我們的數(shù)組中每一個值 , 也就是我們遍歷數(shù)組了 ~