js遍历数组的方法的区别

JavaScript中有多种遍历数组的方法,每种方法都有其特点和适用场景。以下是几种常见的遍历数组的方法及其区别:

  1. for循环:是最基本的遍历数组的方法,适用于任何情况。但代码不够简洁,支持提前跳出循环。break跳出循环,continue跳出当前分支继续下一个循环。
let arr = [1, 2, 3, 4, 5];
for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}
  1. for...of循环:是ES6新增的遍历语法,适用于遍历可迭代对象(如数组、字符串、Map等)。语法简洁,但无法获取索引。支持提前跳出循环。
let arr = [1, 2, 3, 4, 5];
for (let value of arr) {
  console.log(value);
} 
  1. forEach方法:也是数组提供的方法之一,会依次处理数组中的每个元素,但无法跳出循环。同时,无法获取当前元素的索引。可以使用return的方式跳出当前循环分支.不支持break和continue
let arr = [1, 2, 3, 4, 5];
arr.forEach(value => {
if (value === 2) {
        return;
    }
  console.log(value);
});
// 打印
1
3
4
5
  1. map方法:会返回一个新的数组,原始数组不变。主要用于对数组中的每个元素进行操作并返回处理后的新数组。可以跳出循环,但会生成新的数组。不支持break和continue
let arr = [1, 2, 3, 4, 5];
let newArr = arr.map(value => {
  if (value % 2 === 0) { // 只处理偶数,相当于跳出循环
    return value;
  }
});
console.log(newArr); // [2, 4]
  1. filter方法:会返回一个新的数组,只包含符合条件的元素。与map方法类似,可以跳出循环,但会生成新的数组。不支持break和continue
let arr = [1, 2, 3, 4, 5];
let newArr = arr.filter(value => {
  if (value % 2 === 0) { // 只保留偶数,相当于跳出循环
    return true;
  }
});
console.log(newArr); // [2, 4]
  1. for...in循环:用于遍历对象的属性或数组的索引。但通常不用于遍历数组元素,因为会遍历到原型链上的属性。且无法跳出循环。
  2. for...of循环与for...in循环的区别:for...in循环会遍历对象所有可枚举的属性(包括原型链上的),而for...of循环只会遍历对象自身的可枚举属性(不包括原型链上的)。因此,for...of循环更适合遍历数组或类数组对象。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容