(forin和forof区别) for of 和 for in 的区别介绍 JavaScript中两种不同语句：for...of和for...in 全网首发(图文详解1)

for...of 和 for...in 是JavaScript中用于循环的两种不同语句，它们的主要区别在于它们遍历对象时所关注的内容。

for...of语句在可迭代对象（包括Array，Map，Set，String，TypedArray，arguments对象等等）上创建一个循环，遍历其迭代对象的值。

使用for...of时，每次循环将遍历集合的下一个值，并将这个值分配给循环变量。

示例：

let iterable = [10, 20, 30];

for (let value of iterable) {
  console.log(value); // 输出: 10, 20, 30
}

for...in语句以任意顺序迭代一个对象的可枚举属性。它可以用于遍历一个对象的属性。

需要注意的是，for...in应该不被用于迭代一个Array，其中的索引顺序很重要，因为它会以任意顺序遍历数组元素。for...in更适用于遍历对象的键。

示例：

let obj = {a: 1, b: 2, c: 3};

for (let property in obj) {
  console.log(`${property}: ${obj[property]}`); // 输出: "a: 1", "b: 2", "c: 3"
}

对于for...in来说，如果对象原型链上有可枚举属性，这些属性也会被for...in循环遍历。如果不希望遍历这些继承的属性，可以使用hasOwnProperty()方法过滤它们：

for (let property in obj) {
  if (obj.hasOwnProperty(property)) {
    console.log(`${property}: ${obj[property]}`);
  }
}

这样，只有对象自身的属性会被打印，原型链上的属性会被忽略。