一、for循环遍历数组
const array = [1, 2, 3, 4, 5];
for (let i = 0; i < array.length; i++) {
console.log(array[i]);
}
通过for循环遍历数组，可以使用循环变量i来访问数组中的每一个元素。这种遍历方式是最基础的也是最常用的一种方式。但是它需要手动维护循环变量，代码的可读性相对较差。
二、forEach遍历数组
const array = [1, 2, 3, 4, 5];
array.forEach(function(element) {
console.log(element);
});
forEach是数组原型上的一个方法，可以直接使用。它的参数是一个函数，用于遍历数组中的每个元素。在函数内部，我们可以使用参数element来访问当前的元素。这种方式相对于for循环，代码更加简洁，可读性更好。
三、map遍历数组
const array = [1, 2, 3, 4, 5];
const result = array.map(function(element) {
return element * 2;
});
console.log(result);
map也是数组原型上的一个方法，它可以用来遍历数组中的每个元素，并将元素通过回调函数的处理转换成一个新的数组。在回调函数中，我们可以对元素进行任意的操作，比如本例中将每个元素乘以2。map返回的是一个新的数组，所以我们需要将其赋值给一个新的变量。map在开发中使用较多，可以快速生成新的数组。
四、filter遍历数组
const array = [1, 2, 3, 4, 5];
const result = array.filter(function(element) {
return element % 2 === 0;
});
console.log(result);
filter也是数组原型上的一个方法，它可以用来遍历数组中的每个元素，并根据条件过滤出一个新的数组。在回调函数中，我们可以对元素进行条件判断，如果返回true表示该元素符合条件，将被保留在新的数组中。在本例中，我们通过判断元素是否为偶数，将符合条件的元素放入一个新的数组中，并最终返回该数组。
五、reduce遍历数组
const array = [1, 2, 3, 4, 5];
const result = array.reduce(function(previousValue, currentValue) {
return previousValue + currentValue;
}, 0);
console.log(result);
reduce是数组原型上的一个方法，它可以用来遍历数组中的每个元素，并将元素通过回调函数的处理迭代成一个单独的值。在回调函数中，我们可以对元素进行任意的操作，并将元素转换成一个单值。reduce的第一个参数是回调函数，回调函数的第一个参数previousValue表示上一次迭代的结果，第二个参数currentValue表示当前迭代的元素。reduce的第二个参数是回调函数的初始值，如果没有指定，将使用数组的第一个元素作为初始值。
六、for…in遍历数组
const array = [1, 2, 3, 4, 5];
for (let index in array) {
console.log(array[index]);
}
for…in语法可以用来遍历对象中的属性，但是在遍历数组时，它会将元素的下标作为属性来进行遍历。虽然它可以达到遍历数组的目的，但是不推荐使用，因为它的遍历顺序是不可预测的，并且可能会遍历到一些非数字属性。而且在使用ESLint规范代码时，也会提示不要使用for…in来遍历数组。
原创文章，作者：AKGMO，如若转载，请注明出处：https://www.506064.com/n/362041.html
微信扫一扫 
支付宝扫一扫 