在JavaScript中,for…of和for…in都是用来遍历数组或对象的语句,但是它们的遍历方式和作用略有不同。
- for…of遍历数组或类似数组的对象的值,例如:
let arr = [1, 2, 3];
for (let num of arr) {
console.log(num);
}
// 输出:
// 1
// 2
// 3
for…of会依次遍历数组中的每个元素,并将元素的值赋给定义的变量(这里的num),方便对元素进行操作。
- 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都是用来遍历数组或对象的语句,但遍历方式和作用略有不同,使用时需要根据实际需要选择最合适的方式。