for...in 和 Object.hasOwnProperty
2020-06-30 本文已影响0人
IamaStupid
提示:
for...in
不应该用于迭代一个Array
,其中索引顺序很重要。
hasOwnProperty() 方法会返回一个布尔值,指示对象自身属性中是否具有指定的属性(也就是,是否有指定的键)。
先看一段hasOwnProperty的代码,它检查的就是一个对象自身直属拥有的属性是否存在:
o = new Object();
o.b={};
o.b.prop="";
o.hasOwnProperty('prop'); // 返回 false
o.prop = undefined;
o.hasOwnProperty('prop'); // 返回 true
delete o.prop;
o.hasOwnProperty('prop'); // 返回 false
再看一段代码:
var triangle = {a: 1, b: 2, c: 3, d:function(){}};
function ColoredTriangle() {
this.color = 'red';
}
ColoredTriangle.prototype = triangle;
var obj = new ColoredTriangle();
for (var prop in obj) {
console.log(`obj.${prop} = ${obj[prop]}`);
}
// "obj.color = red"
// "obj.a= 1"
// "obj.b= 2"
// "obj.c= 3"
// "obj.d= ƒ (){}"
for (var prop in obj) {
if (obj.hasOwnProperty(prop)) {
console.log(`obj.${prop} = ${obj[prop]}`);
}
}
// "obj.color = red"
如代码:因为a,b,c不是obj对象自身拥有的属性,所以会过滤掉属性a,b,c。
同时,也可以看到,for...in循环不但会循环对象自身的属性color,还会循环原型对象的属性。
下面的代码打印什么?
Object.prototype.objCustom = function() {};
Array.prototype.arrCustom = function() {};
let iterable = [3, 5, 7];
iterable.foo = 'hello';
for (let i in iterable) {
console.log(i);
}
// 0, 1, 2, "foo", "arrCustom", "objCustom"