js中数组遍历方法汇总

1. for语句

const arr = ['a', 'b', 'c', 'd', 'e', 'f'];
for (let i = 0, len = arr.length; i < len; i++) {
    console.log(arr[i]);
}

2. for...in语句

const arr = ['a', 'b', 'c', 'd', 'e', 'f'];
// 遍历数组返回索引
for (let idx in arr) {
    console.log(idx);
}

const obj = {
    a: 1,
    b: 2,
    c: 3
};
// 遍历对象返回对象属性
for (let o in obj) {
    console.log(o);
}

3. for...of语句

const arr = ['a', 'b', 'c', 'd', 'e', 'f'];
for (let i of arr) {
    console.log(i);
}

4. forEach语句

空数组不会执行

const arr = ['a', 'b', 'c', 'd', 'e', 'f'];
arr.forEach(function(item, idx, arr) {
    console.log(item, idx, arr);
});

5. while语句

const arr = ['a', 'b', 'c', 'd', 'e', 'f'];
let i = 0, len = arr.length;
while (i < len) {
    console.log(arr[i]);
    i++;
}

6. do...while语句

const arr = ['a', 'b', 'c', 'd', 'e', 'f'];
let i = 0, len = arr.length;
do {
    console.log(arr[i]);
    i++;
} while (i < len);

7. map方法

不会改变原数组，返回一个新数组
不会执行空数组

const arr = ['a', 'b', 'c', 'd', 'e', 'f'];
arr.map(function(val, idx, arr) {
    console.log(val, idx, arr);
});

8. every方法

用于检测数组所有元素是否符合指定条件（通过行数提供的条件）。
如果有一个元素不满足要求，则返回 false，且剩余元素不再检测；如果都满足条件，则返回 true。
不会对空数组进行检测
不会改变原始数组

const arr = [1, 2, 3, 4, 5, 6];
let test = arr.every(function(val, idx, arr) {
    return val < 7;
});

9. some方法

用于检测数组所有元素是否符合指定条件（通过行数提供的条件）。
如果有一个元素满足要求，则返回 true，且剩余元素不再检测；如果都不满足条件，则返回 false。
不会对空数组进行检测
不会改变原始数组

const arr = [1, 2, 3, 4, 5, 6];
let test = arr.some(function(val, idx, arr) {
    console.log(val, idx, arr);
    return val < 2;
});
console.log(test);

10. filter方法

用于检测数组所有元素是否符合指定条件（通过行数提供的条件）。
返回符合条件的元素，组成新数组。
不会对空数组进行检测
不会改变原始数组

const arr = [1, 2, 3, 4, 5, 6];
let test = arr.filter(function(val, idx, arr) {
    return val < 5;
});
console.log(test);

11. reduce方法

接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。
空数组不会执行回调函数

const arr = [1, 2, 3, 4, 5, 6];
let test = arr.reduce(function(total, val, idx, arr) {
    console.log(total, val, idx, arr);
    return total + val;
});
console.log(test);

12. find方法

返回被检测数组中满足条件的第一个元素，之后的不会再执行；如果没有符合条件的，则返回 undefined。

const arr = [1, 2, 3, 4, 5, 6];
let test = arr.find(function(val, idx, arr) {
    return val > 3;
});
console.log(test);

13. findIndex方法

传入一个条件函数，遍历数组每一项，返回符合条件元素的索引，之后的不会再执行；如果没有符合条件的元素，则返回 -1。
空数组不执行
不改变原数组

const arr = [1, 2, 3, 4, 5, 6];
let test = arr.findIndex(function(val, idx, arr) {
    console.log(val, idx, arr);
    return val > 3;
});
console.log(test);