1. 程式人生 > 其它 >陣列的9個迴圈方式:foreach,map,filter,includes,find,findIndex ,some,every,reduce區別

陣列的9個迴圈方式:foreach,map,filter,includes,find,findIndex ,some,every,reduce區別

  • forEach----只遍歷陣列, 不返回新陣列
  • map----對每項元素做改變後,返回新陣列
  • filter----篩選出符合條件的陣列
  • includes----判斷陣列是否含有某值
  • find----篩選陣列:找元素
  • findIndex----篩選陣列:找索引
  • every----判斷陣列中每一項是否符合條件(內部return false時跳出整個迴圈)
  • some----判斷陣列中某些項是否符合條件(內部return true時跳出整個迴圈)
  • reduce----對每項元素做疊加,返回疊加後的值

1,forEach() --- 遍歷陣列

迴圈遍歷陣列,無法break 跳出迴圈,返回 n 個遍歷的物件

let array = [1,2,3,4,5];                      
array.forEach((item,index)=>{                      
  console.log(item,index)                      
})                             
  // 1,0
  // 2,1                            
  // 3,2                            
  // 4,3                             
  // 5,4

2,map() --- 更新陣列

讓陣列通過一個計算產生一個新陣列,return 返回一個新陣列

let array = [1,2,3,4,5];                      
let newArr = array.map((item,index)=>{
    return item*2                        
})                            
console.log(newArr)                      
// [2,4,6,8,10];

3,filter() --- 篩選陣列

根據條件篩選出陣列中符合的條件的項,return 返回一個新陣列

let array = [1,2,3,4,5];                      
let newArrFilter = array.filter((item,index)=>{
    return item >3
})
console.log(newArrFilter)
// [4,5]

4,includes() --- 篩選陣列

判斷陣列是否包含某一項,返回 Boolean 值

let array = [1,2,3,4,5];
let includes = array.includes(5)
console.log(includes )
// true

5,find() --- 篩選陣列

在集合中找到符合條件的元素,跳出迴圈,return 返回陣列中符合的元素

let array = [1,2,3,4,5];
let finds = array.find((item,index)=>{
  retutn item >2
})
console.log(finds)
// 3

6,findIndex() --- 篩選陣列

在集合中找到符合條件的元素,跳出迴圈,return 返回陣列中符合元素的序列

let array = [1,2,3,4,5];
let findIndex = array.find((item,index)=>{
  retutn item >2
})
console.logfindIndex 
// 2

7,every() --- 判斷陣列

檢查陣列中每一項是否符合條件,全部都滿足才為 true ,return 返回 Boolean

let array = [1,2,3,4,5];
let everyArr1 = array.every((item,index)=>{
  retutn item > 0
})
let array = [1,2,3,4,5];
let everyArr2 = array.every((item,index)=>{
  retutn item > 3
})
console.log(everyArr1) // true
console.log(everyArr1) // false

8,some --- 判斷陣列

檢查陣列中每一項是否符合條件,有一個符合則為true,return 返回 Boolean

let array = [1,2,3,4,5];
let someArr1 = array.some((item,index)=>{
  retutn item > 1
})
let array = [1,2,3,4,5];
let someArr2 = array.some((item,index)=>{
  retutn item > 7
})
console.log(someArr1) // true
console.log(someArr1) // false

9,reduce() --- 疊加陣列

讓陣列中前項和後項做某種計算,並累計最終值,retrun 返回一個值

let array = [1,2,3,4,5];
let reduceArr = array.reduce((prev,next)=>{
  retutn prev + next
})
console.log(reduceArr) // 15(number)