js中for...in 和 for...of 区别

for…in：

• 遍历对象的属性：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 主要用于遍历可迭代对象的值（如数组、字符串、Map、Set 等等）。
• 作用对象：数组、字符串、Map、Set 等可迭代对象。for…of 不适用于普通对象。
• 迭代内容：返回的是迭代对象中的值，而不是索引或属性名。

let arr = [10, 20, 30];

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

区别总结：

• for…in 用于遍历对象的属性名，适合用于对象，而不适合数组，因为会返回数组的索引。
• for…of 用于遍历可迭代对象的值，适合用于数组、字符串等集合类数据，而不适用于普通对象。