forEach
,for...in
和 for...of
是 JavaScript 中用于遍历数据的三种不同的结构。它们在遍历数组、对象和可迭代对象(如 Set 和 Map)时非常有用。尽管它们都可以用于循环遍历,但它们之间存在一些重要的区别:
forEach:
forEach
是数组的一个方法,用于遍历数组的每个元素并应用一个函数。这个函数可以接收两个参数:当前元素的值和当前元素的索引。
示例:
let arr = [1, 2, 3, 4, 5]; arr.forEach(function(value, index) { console.log(value); // 输出:1, 2, 3, 4, 5 });
for...in:
for...in
语句用于遍历对象的可枚举属性。它不会遍历原型链上的属性,只遍历对象自身的属性。
示例:
let obj = {a: 1, b: 2, c: 3}; for (let key in obj) { console.log(key); // 输出:a, b, c }
for...of:
for...of
语句用于遍历可迭代对象(如 Array,Map,Set,String,TypedArray,arguments对象等等)。在每次迭代中,返回的是对象的值,而不是键。
示例:
let arr = [1, 2, 3, 4, 5]; for (let value of arr) { console.log(value); // 输出:1, 2, 3, 4, 5 }
总结一下主要的区别:
forEach
是专门为数组设计的,它遍历数组的每个元素并应用一个函数。for...in
是用来遍历对象属性的,它遍历的是对象的自身可枚举属性,不包括原型链上的属性。for...of
是用来遍历可迭代对象的,它返回的是对象的值,而不是键。
在实际开发中,你可以根据需要选择合适的循环结构。