javascript中for...of和for...in的区别

在JavaScript中，for…of和for…in都是用来遍历数组或对象的语句，但是它们的遍历方式和作用略有不同。

1. for…of遍历数组或类似数组的对象的值，例如：

let arr = [1, 2, 3];
for (let num of arr) {
  console.log(num);
}
// 输出：
// 1
// 2
// 3

for…of会依次遍历数组中的每个元素，并将元素的值赋给定义的变量（这里的num），方便对元素进行操作。

2. for…in则是遍历对象的可枚举属性，例如：

let obj = { name: 'Tom', age: 18 };
for (let key in obj) {
  console.log(key + ': ' + obj[key]);
}
// 输出：
// name: Tom
// age: 18

for…in会依次遍历对象的每个可枚举属性，将属性名赋给定义的变量（这里的key），方便对属性进行操作。

需要注意的是，for…in也会遍历对象原型链上的属性，而且遍历顺序是不确定的。因此，在遍历对象时，一般需要使用hasOwnProperty方法来判断是否是对象自身的属性：

let obj = { name: 'Tom', age: 18 };
Object.prototype.foo = 'bar';
for (let key in obj) {
  if (obj.hasOwnProperty(key)) {
    console.log(key + ': ' + obj[key]);
  }
}
// 输出：
// name: Tom
// age: 18

这个例子中，为了演示for…in遍历原型链的问题，我们在Object.prototype上添加了一个属性foo。如果我们没有使用obj.hasOwnProperty(key)来判断属性是否是对象自身的属性，那么就会输出一个额外的属性foo，这不是我们期望的结果。

综上所述，for...of和for...in都是用来遍历数组或对象的语句，但遍历方式和作用略有不同，使用时需要根据实际需要选择最合适的方式。