Object.prototype.hasOwnProperty.call 为什么要在for in 场景中使用

问题

我们在使用 for… in使用场景的时候，经常会发现一般的写法是这样的

 for (const key in structList.value) {
    if (Object.prototype.hasOwnProperty.call(structList.value, key)) {
        const element = structList.value[key];
        console.log(element);
    }
}

那么 Object.prototype.hasOwnProperty.call 为什么要在for in 场景中使用

分析

在 JavaScript 中，使用 Object.prototype.hasOwnProperty.call 主要是为了确保在使用 for…in 循环遍历对象属性时，获取对象自身的属性而不包括继承的属性。

举个例子，考虑以下对象：

let obj = {
    a: 1,
    b: 2
};

// 给 obj 对象添加一个继承属性
Object.prototype.c = 3;

// 使用 for...in 遍历对象属性
for (let key in obj) {
    console.log(key);
}

上述代码中，for…in 循环将会输出所有的键，包括继承自原型链的键 c。如果我们只想获取对象自身的属性而不包括继承的属性，我们可以使用 hasOwnProperty 方法来检查属性是否是对象自身的属性：

for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
        console.log(key);
    }
}

然而，由于可能存在 hasOwnProperty 方法被覆盖的情况，为了避免潜在的问题，可以使用 Object.prototype.hasOwnProperty.call 来进行检查：

for (let key in obj) {
    if (Object.prototype.hasOwnProperty.call(obj, key)) {
        console.log(key);
    }
}

这样做可以确保我们在遍历对象属性时只获取对象自身的属性，而不包括继承的属性。