for...in/Objecft.keys/Object.getgetOwnPropertyNames 的区别

最近在读underscore 的源码,发现了一个疑问,在underscore中有两个方法_.keys和_.allKeys 这两个方法都是用来获取对像的属性,两个之间有什么不同呢?先看下underscore源码
 
// Retrieve the names of an object's own properties.
// Delegates to **ECMAScript 5**'s native `Object.keys`.
_.keys = function(obj) {
  if (!_.isObject(obj)) return [];
  if (nativeKeys) return nativeKeys(obj);
  var keys = [];
  for (var key in obj) if (has(obj, key)) keys.push(key);
   // Ahem, IE < 9.
  if (hasEnumBug) collectNonEnumProps(obj, keys);
  return keys;
};
 
// Retrieve all the property names of an object.
_.allKeys = function(obj) {
  if (!_.isObject(obj)) return [];
  var keys = [];
  for (var key in obj) keys.push(key);
  // Ahem, IE < 9.
  if (hasEnumBug) collectNonEnumProps(obj, keys);
  return keys;
};

 

源码中的注释写道_.keys用来获取对象自己的属性 , _.allKeys用来获取对象所有的属性,为什么两种获取得到属性不一样?看到这里不太明白,但是注意到了_.keys 和 _.allKeys 的核心代码是Objecft.keys 和 for in ,那么我就开始查看下文档找下两者的具体区别。
在MDN中我们可以找到三者的描述:
  • for…in:for...in 循环只遍历可枚举属性。像 Array和 Object使用内置构造函数所创建的对象都会继承自Object.prototype和String.prototype的不可枚举属性,例如 String 的 indexOf()  方法或 ObjecttoString()方法。循环将遍历对象本身的所有可枚举属性,以及对象从其构造函数原型中继承的属性(更接近原型链中对象的属性覆盖原型属性)。
  • Objecft.keys:Object.keys 返回一个所有元素为字符串的数组,其元素来自于从给定的object上面可直接枚举的属性。这些属性的顺序与手动遍历该对象属性时的一致。
  • Object.getOwnPropertyNames:方法返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括Symbol值作为名称的属性)组成的数组。
 
由描述可以理解为:
  • for…in 会遍历对象的自身的和继承的可枚举属性;
  •  Objecft.keys只能获取自身的可枚举属性;
  •  Object.getOwnPropertyNames可以获取自身的所有属性(包括不可枚举属性)
 
下面用一个例子来做下验证
var parent = {
  a: "a"
};
var child = Object.create(parent, {
  b: {
    value: "b",
    writable: true,
    enumerable: true,
    configurable: true
 },
  c: {
    value: "c",
    writable: true,
    enumerable: false,
    configurable: true
 }
});
 
我们创建了一个对象parent,其有一个属性a,接着创建了一个对象child 其继承了parent 并有两个属性b和c,c是不可枚举属性,下面我们用三种方式来获取child的属性
 
for (var key in child) {
   console.log(key); // b a // 会去继承的属性
}
 
console.log(Object.keys(child)); // ["b”]
 
console.log(Object.getOwnPropertyNames(child)); // ["b", "c"]
 
 
总结:现在我们已经知道三种获取对象属性方式用法的区别,在不同场景中具体使用才能起到有效的解决问题,不能用混。
 
 

转载于:https://www.cnblogs.com/chrissong/p/10542236.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值