數組遍歷方法，本文涉及到的方法大概有 do while、while、for、map、some、every、filter、reduce、reduceRight、forEach、for…in、for…of 12種方法。
一、do…while
與 while 相比，添加滿不滿足，都會執行一次；do…while 後面 花括號{ }爲可選項，不是必須;
var arr = [1,2,3,4] , count1 = 0,
k = arr.length;
do {
// 代碼塊，條件不滿足，也會執行一次
console.log(arr[count1]);
count1++;
} while (count1 < k)
{
// 此代碼塊，可選項，不是必須。條件滿不滿足，都會執行一次
console.log('條件滿不滿足，執行一次'); // 條件滿不滿足，執行一次
}
// 控制檯打印 1,2,3,4
二、while
只有當條件滿足纔會執行
var arr = [1,2,3,4], count = 0, j = arr.length;
while (count < arr.length) {
console.log(arr[count]);
count++;
}
// 控制檯打印 1,2,3,4
三、for
我項目使用此方法居多；do…while、while 使用的比較少
for (let i = 0; i < arr.length; i++){
console.log('for循環', arr[i]);
}
四、map
此方法有返回值，並且不會改變原數組，會返回一個新數組。
var arr = [1,2,3,4];
var returnA = arr.map(item => {
return item * 2
})
console.log(returnA) // 打印 [2, 4, 6, 8]
五、some
此方法有返回值，並且不會改變原數組，數組中有一個條件滿足，就會返回true。
var arr = [1,2,3,4];
var returnB = arr.some(item => {
return item > 2
})
console.log(returnB); // 打印 true
六、every
此方法有返回值，並且不會改變原數組，數組中所有條件滿足，纔會返回true。與上面 some 恰好相反。
var arr = [1,2,3,4];
var returnC = arr.every(item => {
return item > 2
})
console.log(returnC); // 打印 false
七、filter
此方法有返回值，返會一個新數組，並且不會改變原數組，滿足條件的值放到一個新數組裏面返回。
var arr = [1,2,3,4];
var returnD = arr.filter(item => {
return item > 2
})
console.log(returnD); // 打印 [3,4]
八、reduce
此方法有返回值，返回數組相加的結果，並且不會改變原數組。
curr： 當前值加上下一位值的和;
next： 當前循環下標下一位的值,
currentValue 當前循環的值;
thisArr 當前數組。
initialValue 可選。傳遞給函數的初始值(curr)
var arr = [1,2,3,4];
var returnE = arr.reduce((curr, next, currentValue, thisArr ) => {
console.log(curr , next, currentValue, currentIndex)
return curr + next
}, initialValue);
console.log(returnE) // 打印 10
九、reduceRight
此方法有返回值，返回數組相加的結果，並且不會改變原數組。reduceRight 從數組最後一位開始遍歷，reduce 從數組第一位開始遍歷;
curr： 當前值加上下一位值的和;
next： 當前循環下標下一位的值,
currentValue 當前循環的值;
thisArr 當前數組。
initialValue 可選。傳遞給函數的初始值(curr)
var returnF = arr.reduce((curr, next, currentValue, thisArr ) => {
return curr + next
}, initialValue );
console.log(returnF) // 打印 10
十、forEach
此方法沒有返回值，forEach循環函數裏面的 this 指的是 [1,2,3], 不能使用 es6 的箭頭函數，會影響this指向.
注意: forEach() 對於空數組是不會執行回調函數的 詳細查看此篇文章
var arr = [1,2,3];
// item：當前循環的值, index 當前值得下標, arr 當前循環的數組
var returnG = arr.forEach(function(item, index, arr) {
console.log('forEach', item, this);
}, [1,2,3])
// 第二個參數代表初始值
console.log(returnG);
//forEach 1 (3) [1, 2, 3]
//forEach 2 (3) [1, 2, 3]
//forEach 3 (3) [1, 2, 3]
十一、for…in
for…in 用來循環數組或者對象，一般用來循環對象；下標 i 值 從0 開始；
var arr = [1, 2, 3];
for (leti in arr) {
console.log(i, arr[i]);
}
// i 代碼當前循環數組的下標， arr[i] 代表當前下標的值
// 0 1
// 1 2
// 2 3
var obj = {
name: 'jim',
age: 18
}
for (let i in obj) {
console.log(i, obj[i]);
}
// i：代表當前循環對象的屬性， obj[i]: 代表當前對象屬性的值，輸出 一下
// name jim
// age 18
// 給數組添加一個foo屬性
arr1.foo = '4';
console.log(arr); // [1, 2, 3, foo: "4"]
console.log(arr.foo) // 4
// 再次循環
for(let i of arr){
console.log(i, arr[i-1])
}
// 1 1
// 2 2
// 3 3
// foo 4 // **for..in 可以循環出來**
十二、for…of
for…of 與 for…in 基本上沒有區別，區別的地方
（1） 下標 i 值 從 1 開始，for…in 下標從0開始
（2）給數組添加 一個屬性arr.foo = ‘4’，使用for…of 不會循環出 foo屬性來。
// for..of
let arr = [1, 2, 3];
for(let i of arr){
console.log(i, arr[i])
}
arr1.foo = '4';
console.log(arr); // [1, 2, 3, foo: "4"]
console.log(arr.foo) // 4
// 再次循環
for(let i of arr){
console.log(i, arr[i-1])
}
// 1 1
// 2 2
// 3 3 // **區別：for..of 不會循環出屬性來**
十三、find
找到第一個滿足測試函數的元素並返回那個元素的值，如果找不到，則返回;多個重複的值，也只是返回第一個；該方法有兩個參數
第一個 function(item, index, arr){}
第二個 thisValue
var arr = [1, 2, 3];
var returnH = arr.find(function(item, index, arr){
// this 代表find 函數 第二個參數 [2]
console.log(this)
return item == 2;
}, [2]);
console.log(returnH); // 2
find 函數內部的this值得是 第二個參數，會輸出 [2]
十四、findIndex
找到第一個滿足測試函數的元素並返回那個元素的索引下標，如果找不到，則返回 -1；多個重複的值，也只是返回第一個值的下標，從0 開始；
該方法有兩個參數
第一個 function(item, index, arr){}
第二個 thisValue
var returnI = [1,2,2,3].findIndex(function(item){
// this 代表第二個參數 [2]
return item == 2
}, [3]);
console.log(returnI) // 1
findIndex 函數內部的this值得是 第二個參數，會輸出 [3]
以上是整理的數組和對象的循環方法，有不對的地方還望大家指出。希望大家可以點個贊，謝謝。