JS的15种遍历循环方式_全面解析JavaScript循环遍历方法

码农

2025-04-25 12

在JavaScript中，有多种方式可以遍历数组或对象。以下是15种常见的遍历循环方式：

for 循环

for (let i = 0; i < array.length; i++) {
    console.log(array[i]);
}

for...of 循环

for (let value of array) {
    console.log(value);
}

forEach 方法

array.forEach((value, index) => {
    console.log(value, index);
});

map 方法（虽然主要用于转换数组，但也可以用于遍历）

array.map((value, index) => {
    console.log(value, index);
    return value; // map 需要返回值
});

for...in 循环（不推荐用于数组，但技术上可行）
```
for (let index in array) {
    console.log(array[index]);
}
```

while 循环

let i = 0;
while (i < array.length) {
    console.log(array[i]);
    i++;
}

do...while 循环

let i = 0;
do {
    console.log(array[i]);
    i++;
} while (i < array.length);

reduce 方法（通过累加器进行遍历，通常用于计算）

array.reduce((accumulator, value, index) => {
    console.log(value, index);
    return accumulator; // reduce 需要返回值
}, 0);

entries 方法结合 for...of

for (let [index, value] of array.entries()) {
    console.log(index, value);
}

keys 方法结合 for...of（只遍历索引）

for (let index of array.keys()) {
    console.log(index, array[index]);
}

values 方法结合 for...of（只遍历值）

for (let value of array.values()) {
    console.log(value);
}

for...in 循环（用于对象）

for (let key in object) {
    if (object.hasOwnProperty(key)) {
        console.log(key, object[key]);
    }
}

Object.keys 方法结合 forEach

Object.keys(object).forEach(key => {
    console.log(key, object[key]);
});

Object.values 方法结合 forEach

Object.values(object).forEach(value => {
    console.log(value);
});

Object.entries 方法结合 for...of

for (let [key, value] of Object.entries(object)) {
    console.log(key, value);
}

这些方法各有其适用场景和优缺点，选择合适的遍历方式可以提高代码的可读性和性能。