解释 JavaScript 中 for(..in) 和 for(..of) 语句的区别

JavaScript 中，for(..in) 和 for(..of) 语句都是用于遍历对象的语句。它们在语法上看起来相似，但实际上有着不同的用途。

for(..in)语句

for(..in) 语句用于遍历对象的属性，语法如下：

for (var variable in object) {
  // code block to be executed
}

其中，variable 是用于枚举对象属性的变量，object 为要遍历的对象。

示例代码：

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

for (var prop in obj) {
  console.log(prop + ': ' + obj[prop]);
}

上述代码输出结果为：

a: 1
b: 2
c: 3

for(..in) 语句会遍历对象原型链上的所有可枚举属性，包括从原型继承的属性。此外，for(..in) 也可以用于遍历数组中的索引。

for(..of)语句

for(..of) 语句用于遍历可迭代对象的元素，语法如下：

for (var variable of iterable) {
  // code block to be executed
}

其中，variable 是用于存储迭代元素的变量，iterable 为要遍历的可迭代对象，如数组等。

示例代码：

var arr = [1, 2, 3];

for (var elem of arr) {
  console.log(elem);
}

上述代码输出结果为：

1
2
3

for(..of) 语句只能遍历可迭代对象的元素，如数组、字符串、类数组对象等，不能遍历普通对象的属性。此外，它只遍历对象自身的属性，不包括继承的属性。

总结

总的来说，for(..in) 适用于遍历对象属性，包括从原型链继承的属性；for(..of) 适用于遍历可迭代对象的元素。在编写代码时，应根据不同的需求选用合适的遍历语句。