es6中迭代陣列的方法有哪些
迭代方法：1、map，用於根據某種規則對映陣列，得到對映之後的新陣列；2、filter，用於根據判斷的條件，進行元素篩選；3、forEach，相當於使用for迴圈遍歷陣列；4、some，用於判斷陣列中是否有滿足條件的元素；5、every，用於判斷陣列中是否所有元素都滿足條件；6、findIndex，用於找元素下標；7、reduce，可遍歷陣列元素，為每一個元素執行一次回撥函數。
前端（vue）入門到精通課程：進入學習
Apipost = Postman + Swagger + Mock + Jmeter 超好用的API偵錯工具：
本教學操作環境：windows7系統、ECMAScript 6版、Dell G3電腦。
Array應該是es6中最常用的型別了，它和其他語言中的陣列一樣也是一組有序的資料，但是不同的是，ECMAscript陣列中陣列的每個槽位可以儲存任意型別的資料，意思就是說，我們可以在第一個槽位中儲存字串，第二個是數值，第三個是物件。而ECMAscript陣列中最常使用的就是迭代方法，下面為大家詳細介紹一下。
ES6陣列的7種迭代方法
1、map()方法
對陣列每一項都傳入執行函數，返回由每次函數呼叫的結果構成的陣列。
作用: 根據某種規則對映陣列，得到對映之後的新陣列
應用場景：
(1)陣列中所有的元素 * 0.8
(2)將陣列中的js物件，對映成 html字串
範例：
const arr = [10,20,30,40,50]
// 完整寫法
// let res = arr.map((item,index)=>{
// return item * 0.8
// })
// 熟練寫法
let res = arr.map(item=>item*0.8)
console.log(res)
// 返回處理後的新陣列 [8, 16, 24, 32, 40]登入後複製
2、filter()方法
對陣列每一項都傳入執行函數，函數返回true的項會組成陣列之後返回。
作用：根據判斷的條件，進行篩選。
應用場景：
(1)篩選陣列中的偶數
(2)商品價格篩選
範例：
//需求： 篩選陣列裡的偶數
const arr = [10,20,33,44,55]
// let res = arr.filter(item=>{
// if(item % 2 == 0){
// return true
// } else{
// return false
// }
// })
// console.log(res)
let res1 = arr.filter(item => item % 2==0)
console.log(res1) // [10, 20, 44]登入後複製
3、forEach()方法
對陣列每一項都傳入執行函數，沒有返回值。
作用：相當於 for迴圈另一種寫法
應用場景：遍歷陣列
範例：
// 類似for迴圈遍歷
const arr = [13,22,10,55,60]
arr.forEach((item,index)=>{
console.log(item,index)
// item->陣列裡每一個元素
// index->對應的下標
})登入後複製
4、some()方法
對陣列每一項都傳入執行函數，若有一項函數返回true，則這個方法返回true。
作用：判斷陣列中是否有滿足條件的元素 (邏輯或 ||, 有任意一個滿足即可)
應用場景：
(1)判斷陣列中有沒有奇數
(2)非空判斷 : 判斷表單陣列中，有沒有元素value為空
範例：判斷是否有奇數
// 判斷是否有奇數
const arr = [10,20,30,40,50]
// let res = arr.some(item=>{
// if(item % 2 == 1){
// return true
// } else{
// return false
// }
// })
let res = arr.some(item =>item % 2 == 1)
console.log(res)
// true: 有滿足條件的元素
// false: 沒有滿足條件的元素登入後複製
5、every()方法
對陣列每一項都傳入執行函數，若每一項都返回true，則這個方法為true。
作用：判斷陣列中是否 所有元素 都滿足條件 (邏輯&&, 全部滿足)
應用場景：
(1)判斷陣列中是否所有元素都是 偶數
(2)開關思想 : 購物車是否全選
範例：判斷是否全是偶數
// 判斷是否全是偶數
const arr = [10,20,30,40,50]
// let res = arr.some(item=>{
// if(item % 2 == 1){
// return true
// } else{
// return false
// }
// })
let res = arr.every(item =>item % 2 == 0)
console.log(res)
// true: 所有滿足都滿足條件
// false: 有元素不滿足條件登入後複製
6、findIndex()方法
作用：找元素下標
應用場景：
(1)如果陣列中是值型別，找元素下標用： arr.indexOf( 元素 )
(2)如果陣列中是參照型別，找元素下標： arr.findIndex( )
範例：
/*
arr.findIndex()查詢陣列下標
如果找到目標元素，則返回改陣列的下標
如果沒找到，則返回固定值-1
*/
let arr = [
{name:'李四',age:20},
{name:'王五',age:20},
{name:'張三',age:20},
]
let index = arr.findIndex(item=>item.name == '王五')
console.log(index)登入後複製
7、reduce()方法
作用：遍歷陣列元素，為每一個元素執行一次回撥函數
應用場景：陣列求和/平均值/最大值/最小值
範例：
const arr = [10,20,30,40,50]
let res = arr.reduce((sum,item,index)=>{
return sum + item
// console.log(sum,item,index)
},0)登入後複製
方法的區別與細節
every()和some()
這些方法中，every()和some()是最相似的，都是從陣列中搜素符合某個條件的元素。對every()來說，傳入的引數必須對每一項都返回true，它才會返回true。而對於some()來說，只要有一項讓傳入的函數返回true，它就返回true，下面舉個例子：
let numbers = [2,1,4,3,5,4,3];
let everyResult = numbers.every((item,index,array) => item >2);
console.log(everyResult); // false
let someResult = numbers.some((item,index,array) => item >2);
console.log(someResult); // true
登入後複製filter()方法
這個方法基於給定的函數來決定每一項是否應該包含在它返回的陣列中。例如：
let numbers = [2,1,4,3,5,4,3];
let filterResult = numbers.filter((item,index,array) => item >2);
console.log(filterResult); // 4,3,5,4,3
登入後複製這裡filter返回的陣列包含了4,3,5,4,3，因為只有對這些項傳入的函數才返回 true，這個方法非常適合從陣列中篩選滿足給定條件的元素，也是非常常用的迭代方法。
map()
map()方法也是返回一個陣列。這個陣列的每一項都是對原始陣列中同樣位置的元素執行傳入函數而返回的結果，例如，可以將陣列中的每一項都乘以2，並返回包含所有結果的陣列，如下：
let numbers = [2,1,4,3];
let mapResult = numbers.map((item,index,array) => item *2);
console.log(mapResult); // 4,2,8,6
登入後複製這個方法返回的陣列包含了原始陣列中每給數值乘以2的結果。這個方法很適應於建立一個與原陣列一一對應的新陣列。
forEach()
最後看一看forEach這個方法，這個方法只會對每一項執行傳入的函數，沒有返回值。其實，本質上，forEach()方法相當於使用for迴圈遍歷陣列。例如：
let numbers = [2,1,4,3];
numbers.forEach((item,index,array) => {
console.log(item)
}); // 2,1,4,3登入後複製【相關推薦：、】
以上就是es6中迭代陣列的方法有哪些的詳細內容，更多請關注TW511.COM其它相關文章！
