可枚举属性和不可枚举属性(for...in循环和Objec.keys()和Object.getOwnPropertyNames())...

本文详细对比了JavaScript中for...in循环、Object.keys()及Object.getOwnPropertyNames()三种对象遍历方法的区别。for...in会遍历原型链上的可枚举属性;Object.keys()仅遍历对象自身的可枚举属性;而Object.getOwnPropertyNames()则遍历对象自身的所有属性,无论是否可枚举。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 for...in循环是 遍历对象的每一个可枚举属性,包括原型链上面的可枚举属性,而Object.keys()只是遍历自身的可枚举属性,不可以遍历原型链上的可枚举属性. 这是for...in和Object.keys()的主要区别,而Object.getOwnPropertyNames()则是遍历自身所有属性(不论是否是可枚举的),不包括原型链上面的.

 

举个例子:

function People(){

  this.name = 'Tom';

  this.age = 24;

  this.c = function(){

  console.log('1');
  }
}
People.prototype.look = function(){
  console.log('look at this');
}
var b = new People();
//使用Object.defineProperty方法为b添加一个'sex'的不可枚举属性
Object.defineProperty(b,'sex',{
value:'女',
enumerable:false
});
for(var i in b){
  console.log(i);
}

我们可以遍历到对象b的所有可枚举属性,其中包括从原型继承来的look.

 

 

接着我们使用Object.keys()来遍历,代码如下:

function People(){

  this.name = 'Tom';

  this.age = 24;

  this.c = function(){

  console.log('1');
  }
}
People.prototype.look = function(){
  console.log('look at this');
}
var b = new People();
//使用Object.defineProperty方法为b添加一个'sex'的不可枚举属性
Object.defineProperty(b,'sex',{
value:'女',
enumerable:false
});
console.log(Object.keys(b));//结果["name","age","c"]

 

从打印的结果我们看到, Object.keys()遍历的是自身可枚举属性,他不包括原型链上的look.

下面我们使用Object.getOwnPropertyNames()方法试试,具体代码如下:

function People(){

  this.name = 'Tom';

  this.age = 24;

  this.c = function(){

  console.log('1');
  }
}
People.prototype.look = function(){
  console.log('look at this');
}
var b = new People();
//使用Object.defineProperty方法为b添加一个'sex'的不可枚举属性
Object.defineProperty(b,'sex',{
value:'女',
enumerable:false
});
console.log(Object.getOwnPropertyNames(b));//结果["name", "age", "c", "sex"]

可以看到,Object.getOwnPropertyNames()遍历的是自身的可枚举和不可枚举属性,  不含原型链上的.

具体可以查看Object.keys()方法,  for...in循环,  Object.getOwnPropertyNames()方法,以及Object.defineProperty()方法.

 

转载于:https://www.cnblogs.com/lxk0301/p/7235319.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值