Javascript中如何循环(常用方法推荐)

在JavaScript中，遍历集合（如数组、对象、Map和Set等）有多种方式。以下是一些常用的方法：

数组(Array)

for 循环

传统循环，适用于所有版本的JavaScript。

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

forEach 方法

ES5 引入，用于遍历数组元素。

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

for…of 循环

ES6 引入，用于遍历可迭代对象（包括数组）。

for (const element of array) {
  console.log(element);
}

map 方法

创建一个新数组，其结果是对调用数组中的每个元素执行提供的函数的结果。

const newArray = array.map(element => /* ... */);

filter 方法

创建一个新数组, 包含通过所提供函数实现的测试的所有元素。

reduce 方法

对数组中的每个元素执行一个由您提供的reducer函数(升序),将其结果汇总为单个返回值。

some 和 every 方法

• some: 测试数组中的某些元素是否至少有一个满足提供的函数。
• every: 测试数组中的所有元素是否都满足提供的函数。

对象(Object)

for…in 循环

遍历对象自身的和继承的可枚举属性（不含 Symbol 属性）。

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

Object.keys(), Object.values(), Object.entries()

这些方法返回一个包含对象键名、键值或键值对的数组，可以结合数组的遍历方法使用。

Map

for…of 循环

可以直接遍历Map的键值对。

for (const [key, value] of map) {
  console.log(key, value);
}

forEach 方法

类似于数组的forEach，但专门针对Map设计。

map.forEach((value, key) => {
  console.log(key, value);
});

Set

for…of 循环

直接遍历Set中的值。

for (const value of set) {
  console.log(value);
}

forEach 方法

与Map类似，Set也有自己的forEach方法。

set.forEach(value => {
  console.log(value);
});

这些是遍历不同类型的集合时最常用的几种方法。选择哪种方法取决于你的具体需求以及你所使用的JavaScript环境。

以下是对各种循环类型的总结 数组(Array)

for 循环

• • 优点: 灵活性高，适用于所有版本的JavaScript；可以方便地控制循环逻辑。
  • 缺点: 代码量相对较多，不如一些更高阶的方法简洁。

forEach 方法

• 优点: 语法简洁，易于阅读；适合于不需要返回新数组或修改原有数组的情况。
• 缺点: 不能中途跳出循环（如break），也不能跳过某些迭代（如continue）；不支持异步操作。

for…of 循环

• 优点: 语法简单，可读性强；允许使用break和continue。
• 缺点: 相对较新的特性，可能在旧环境中不被支持。

map 方法

• 优点: 返回一个新的数组，不会改变原数组；非常适合用于转换数组元素。
• 缺点: 如果你不需要创建新数组，那么使用map可能会浪费内存。

filter 和 reduce 方法

• 优点: filter可以轻松筛选数据，而reduce可以用来累积计算或复杂的数据处理。
• 缺点: 对于复杂的操作，代码可能会变得难以理解。

some 和 every 方法

• 优点: 用于检查条件是否满足时非常有用，能立即退出循环。
• 缺点: 只适用于布尔判断场景。

对象(Object)

for…in 循环

• 优点: 可以遍历对象的所有枚举属性，包括继承的属性。
• 缺点: 需要额外检查属性是否属于对象本身（使用hasOwnProperty），并且会遍历原型链上的属性，这可能是不必要的。

Object.keys(), Object.values(), Object.entries()

• 优点: 提供了更精确的遍历方式，只针对对象自身的属性；返回的数组可以与数组的遍历方法结合使用。
• 缺点: 创建了新的数组，可能会有性能开销。

 Map 和 Set

对于Map和Set，for...of和forEach方法都有它们各自的优点：

• for…of：提供了一种直接遍历键值对的方式，并且可以使用break和continue语句。
• forEach：语法简洁，但无法中途退出循环。

到此这篇关于Javascript中如何循环的文章就介绍到这了,更多相关js循环内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

来源链接：https://www.jb51.net/javascript/339824iyp.htm