for...in 和 Object.hasOwnProperty

2020-06-30  本文已影响0人  IamaStupid

for...in语句以任意顺序遍历一个对象的除Symbol以外的可枚举属性。

提示: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"

上一篇下一篇

猜你喜欢

热点阅读