for...in 和 for...of 都是 JavaScript 中用于循环遍历数组和对象的语句，但是它们的作用有所不同。

一：区别

类型上：

1：遍历对象上：for in可以，for of不可以

2：遍历Map Set上：for of可以，for in不可以

3：遍历generator上：for of可以，for in不可以

可枚举vs可迭代上：

1：for in 用于可枚举的数据，如对象、数组、字符串，得到key

2：for of 用于可迭代的数据，如数组、字符串、Map、Set、generator，得到value

二：总结

1：for...in 循环遍历的是对象的属性名，而 for...of 循环遍历的是可迭代对象的值

2：在遍历数组等可迭代对象时，建议使用 for...of 循环，而不是 for...in 循环

3：for...of 循环只能用于遍历可迭代对象，而不能用于遍历普通对象

三：代码

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

for (let key in obj) {
  console.log(key + ": " + obj[key]);
}

const arr = [1, 2, 3];

for (let value of arr) {
  console.log(value);
}