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

for...in 和 for...of 是 JavaScript 中两种不同的循环结构，它们在遍历对象时有一些区别。

首先，for...in 用于遍历对象的可枚举属性，包括对象自身和继承自原型链的属性。它返回一个包含属性名称的数组，然后我们可以使用 for 循环来访问每个属性的值。

let obj = {a: 1, b: 2, c: 3};  
let keys = [];  
for(let key in obj){  
  keys.push(key);  
}  
console.log(keys); // ["a", "b", "c"]

for...of 则用于遍历对象的可迭代属性，它返回一个包含属性键值对的数组。我们可以使用 for...of 循环直接访问每个属性的键和值。

let obj = {a: 1, b: 2, c: 3};  
let entries = [];  
for(let [key, value] of Object.entries(obj)){  
  entries.push([key, value]);  
}  
console.log(entries); // [["a", 1], ["b", 2], ["c", 3]]

        需要注意的是，for...in 只能遍历对象的可枚举属性，而不能遍历对象的可迭代属性。因此，如果需要遍历对象的所有属性（包括不可枚举属性和可迭代属性），需要结合使用其他方法。

        此外，for...in 和 for...of 的语法也有所不同。for...in 的语法是 for (key in object)，而 for...of 的语法是 for (value of object.values()) 或 for (key value of object)。同时，for...in 返回的是属性名称的数组，而 for...of 返回的是属性键值对的数组。因此，在遍历对象时需要根据具体的需求选择合适的循环结构。