forEach()
map()----更新數組
filter()、includes()、find()、findIndex()----篩選（刪除）數組
some()、every()----判斷數組
reduce()----疊加數組
arr.forEach()
遍歷數組全部元素，利用回調函數對數組進行操作，自動遍歷數組.length次，且無法break中途跳出循環，不可控
不支持return操作輸出，return只用於控制循環是否跳出當前循環
示例：
[1,2,3,4].forEach((n)=>{
console.log(n);
})
arr.map()----更新數組
創建新數組
不改變原數組
輸出的是 return什么就輸出什么 新數組
回調函數參數，item(數組元素)、index(序列)、arr(數組本身)
使用return操作輸出，會循環數組每一項，並在回調函數中操作
示例：
var arr = [1,2,3,4,5] ;
var newArr = arr.map(function(item,index){
return item*2 ; //操作更新數組
})
console.log(newArr); //打印新數組
console.log(arr); //打印原數組，map()沒有改變原數組
arr.filter()、includes()、find()、findIndex()— —篩選數組
1、arr.filter()
創建新數組
不改變原數組
輸出的是 判斷為true的數組元素 組成的新數組
回調函數參數，item(數組元素)、index(序列)、arr(數組本身)
使用return操作輸出，會循環數組每一項，並在回調函數中操作
示例：
var arr = [1,2,3,4,5] ;
var newArr = arr.filter(function(item,index){
return item>2&&item<5 ; //根據判斷為true來遍歷循環添加進新數組
})
console.log(newArr); //打印新數組
console.log(arr); //打印原數組，map()沒有改變原數組
二、arr.includes()
只是判斷數組是否含有某值，不用return，不用回調函數，輸出一個true或false
示例
var arr = [1,2,3,4,5] ;
var new1 = arr.includes(5); //不用回調函數，且是完全匹配才行如原數組是55則flase（實用性不如正則）
console.log(new1);
console.log(arr);
三、arr.find()
不創建新數組
不改變原數組
輸出的是一旦 判斷為true 則跳出循環輸出符合條件的數組元素
回調函數參數，item(數組元素)、index(序列)、arr(數組本身)
使用return操作輸出，會循環數組每一項，並在回調函數中操作
示例：
var arr = [1,2,3,4,5] ;
var new1 = arr.find(function(item,index){
return item>2&&item<5 ; //當遍歷循環到判斷到一個為true則跳出循環，輸出當前數組元素，不再循環
})
var new2 = arr.find(function(item,index){
return item.toString().indexOf(5)>-1 ; //把當前數組元素轉為字符串，則可index()>-1判斷是否含有某字符
})
console.log(new1); //打印操作后的結果
console.log(new2) //打印是否含有某字符（用正則會更好，這里學習使用一下）
console.log(arr); //打印原數組，find()沒有改變原數組
四、arr.findIndex()— — 與find()相同
不創建新數組
不改變原數組
輸出的是一旦 判斷為true 則跳出循環輸出符合條件的數組元素
回調函數參數，item(數組元素)、index(序列)、arr(數組本身)
使用return操作輸出，會循環數組每一項，並在回調函數中操作
var arr = [1,2,3,4,5] ;
var new1 = arr.findIndex(function(item,index){
return item>2&&item<5 ; //當遍歷循環到判斷到一個為true則跳出循環，輸出當前數組元素序列，不再循環
})
var new2 = arr.findIndex(function(item,index){
return item.toString().indexOf(5)>-1 ; //把當前數組元素轉為字符串，則可index()>-1判斷是否含有某字符
})
console.log(new1); //打印操作后的結果
console.log(new2) //打印是否含有某字符（用正則會更好，這里學習使用一下）
console.log(arr); //打印原數組，findIndex()沒有改變原數組
arr.some()、every()— —判斷數組
一、some()
不創建新數組
2、不改變原數組
3、輸出的是判斷為true則馬上跳出循環並return成true
4、回調函數參數，item(數組元素)、index(序列)、arr(數組本身)
5、使用return操作輸出，會循環數組每一項，並在回調函數中操作
var arr = [1,2,3,4,5] ;
var new1 = arr.some(function(item,index){
return item>2&&item<5 ; //判斷出一個符合條件則跳出循環並輸出true
})
var new2 = arr.some(function(item,index){
return item>5 ; //判斷出數組全部元素都不符合條件則輸出flase
})
console.log(new1);
console.log(new2);
console.log(arr);
二、every()— —與some相反
reduce()— —疊加數組
不一定在數學意義上的疊加計算，這里疊加指：可以利用前遍歷操作的結果到下一次遍歷使用，重復疊加使用下去
1、創建新數組
2、不改變原數組
3、輸出的是return疊加什么就輸出什么 新數組
4、回調函數參數
pre(第一次為數組第一項，之后為上一操作的結果)
next(數組的下一項)
index(next項的序列)
arr(數組本身)
回調函數后的改變第一項參數。（不影響原數組）
5、使用return操作輸出，會循環數組每一項，並在回調函數中操作
//求和計算
var arr1 = [1,2,3,4,5] ;
var new1 = arr1.reduce(function(sum,next,index){
return sum+next ;
/*
*第一次：pre-->1 next-->2 index-->1
*遍歷計算return得結果為pre+next=1+2=3
*第二次：pre-->3 next-->3 index-->2
*遍歷計算return得結果為pre+next=3+3=6
*第三次：pre-->6 next-->4 index-->3
*遍歷計算return得結果為pre+next=6+4=10
*第四次：pre-->10 next-->5 index-->4
*遍歷計算return得結果為pre+next=10+5=15
*/
})
//扁平化數組
var arr2 = [[1,2,3],[4,5],[6,7]] ;
var new2 = arr2.reduce(function(pre,next,index){
return pre.concat(next); //前數組拼接后數組 .concat()
})
//對象數組疊加計算
var arr3 = [{price:10,count:1},{price:15,count:2},{price:10,count:3}];
var new3 = arr3.reduce(function(pre,next,index){
return pre+next.price*next.count;
//當需要對第一項進行操作時，后面pre使用上一項操作結果，不再需要操作
//所以當需要操作第一項的時候，利用reduce(callbreak(){},往數組第一項前添加一項，如:0)
},0) //在原數組第一項添加為0，不改變原數組，則可不操作第一項
console.log(new1);
console.log(new2);
console.log(new3);
console.log(arr1); //普通數組
console.log(arr2); //多重數組
console.log(arr3); //對象數組
---------------------
作者：reda-陶
來源：CSDN
原文：https://blog.csdn.net/RedaTao/article/details/89151381
版權聲明：本文為博主原創文章，轉載請附上博文鏈接！