var parent = Object.create(Object.prototype, {
a: {
value: 1,
writable: true,
enumerable: true,
configurable: true
}
});

parent继承自Object.prototype,有一个可枚举的属性a。下面我们在创建一个继承自parent的对象child。

var child = Object.create(parent, {
b: {
value: 2,
writable: true,
enumerable: true,
configurable: true
},
c: {
value: 3,
writable: true,
enumerable: false,
configurable: true
}
});

child有两个属性b和c,其中b为可枚举属性,c为不可枚举属性。

下面我们将用四种方法遍历child对象,来比较四种方法的不同。如下的代码代表程序的输出。

for in

for in是es3中就存在,最早用来遍历对象(集合)的方法。

for (var key in child) {
console.log(key);
}
// > b
// > a

从输出可以看出,for in会输出自身以及原型链上可枚举的属性。

注意:不同的浏览器对for in属性输出的顺序可能不同。

如果仅想输出自身的属性可以借助 hasOwnProperty。可以过滤掉原型链上的属性。

for (var key in child) {
if (child.hasOwnProperty(key)) {
console.log(key);
}
}
// > b

上面的代码,仅输出了child自己的可枚举属性b,而没有输出原型parent中的属性。

Object.keys

Object.keyses5中新增的方法,用来获取对象自身可枚举的属性键。

console.log(Object.keys(child));
// > ["b"]

可以看出Object.keys的效果和for in+hasOwnProperty的效果是一样的。

Object.getOwnPropertyNames

Object.getOwnPropertyNames也是es5中新增的方法,用来获取对象自身的全部属性名。

console.log(Object.getOwnPropertyNames(child));
// > ["b", "c"] 总结 而遍历对象有5种方法:
(1)for...in
  for...in循环遍历对象自身的和继承的可枚举属性(不含Symbol属性)。
(2)Object.keys(obj)
  Object.keys返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含Symbol属性)。
(3)Object.getOwnPropertyNames(obj)
  Object.getOwnPropertyNames返回一个数组,包含对象自身的所有属性(不含Symbol属性,但是包括不可枚举属性)。
(4)Object.getOwnPropertySymbols(obj)
  Object.getOwnPropertySymbols返回一个数组,包含对象自身的所有Symbol属性。
(5)Reflect.ownKeys(obj)

  Reflect.ownKeys返回一个数组,包含对象自身的所有属性,不管是属性名是Symbol或字符串,也不管是否可枚举。

 

for in,Object.keys和Object.getOwnPropertyNames的区别的更多相关文章

  1. JavaScript中in操作符(for..in)、Object.keys()和Object.getOwnPropertyNames()的区别

    ECMAScript将对象的属性分为两种:数据属性和访问器属性.每一种属性内部都有一些特性,这里我们只关注对象属性的[[Enumerable]]特征,它表示是否通过 for-in 循环返回属性,也可以 ...

  2. [转] JavaScript中in操作符(for..in)、Object.keys()和Object.getOwnPropertyNames()的区别

    ECMAScript将对象的属性分为两种:数据属性和访问器属性.每一种属性内部都有一些特性,这里我们只关注对象属性的[[Enumerable]]特征,它表示是否通过 for-in 循环返回属性,也可以 ...

  3. 小tips:JS之for in、Object.keys()和Object.getOwnPropertyNames()的区别

    for..in循环 使用for..in循环时,返回的是所有能够通过对象访问的.可枚举的属性,既包括存在于实例中的属性,也包括存在于原型中的实例.这里需要注意的是使用for-in返回的属性因各个浏览器厂 ...

  4. or in 、Object.keys()以及Object.getOwnPropertyNames有什么区别?

    or in .Object.keys()以及Object.getOwnPropertyNames的区别 var obj= Object.create(parent, { b: { value: 2, ...

  5. 遍历对象属性(for in、Object.keys、Object.getOwnProperty)

    js中几种遍历对象的方法,包括for in.Object.keys.Object.getOwnProperty,它们在使用场景方面各有不同. for in 主要用于遍历对象的可枚举属性,包括自有属性. ...

  6. js 遍历对象属性(for in、Object.keys、Object.getOwnProperty) 以及高效地输出 js 数组

    js中几种遍历对象的方法,包括for in.Object.keys.Object.getOwnProperty,它们在使用场景方面各有不同. for in 主要用于遍历对象的可枚举属性,包括自有属性. ...

  7. 关于Object.keys()和for in的区别

    今天见到一道面试题让说一说Object.keys()和for in的区别,顿时有些发懵“What's Object.keys?”我立马上网搜了一下,大致作用也是做遍历,参数是一个对象,返回值是一个数组 ...

  8. 关于Object.keys()和Object.values()的使用

    关于Object.keys()和Object.values()的使用 1. 关于Object.keys() 1) 处理对象,返回可枚举的所有可枚举属性的字符串数组 let person ={ name ...

  9. Object.keys、Object.getOwnPropertyNames区别

    用途 Object.keys 定义:返回一个对象可枚举属性的字符串数组: Object.getOwnPropertyNames 定义:返回一个对象可枚举.不可枚举属性的名称: 属性的可枚举性.不可枚举 ...

随机推荐

  1. Qt 的线程与事件循环

    Qt 的线程与事件循环

  2. [CF1007B]Pave the Parallelepiped[组合计数+状态压缩]

    题意 \(t\) 组询问,给你 \(A, B, C\) ,问有多少组三元组 \((a, b, c)\) 满足他们任意排列后有: \(a|A,\ b|B,\ c|C\) . \(A,B,C,t\leq ...

  3. LeetCode 4Sum (Two pointers)

    题意 Given an array S of n integers, are there elements a, b, c, and d in S such that a + b + c + d = ...

  4. 软件工程第二次作业(One who wants to wear the crown, Bears the crown.)

    小镓自述Eclipse使用及自动单元测试技术 因为本人对JAVA有一些兴趣,所以就决定用Eclipse来完成这次作业,从安装Eclipse到学习写代码,最后学会用Junit来进行单元测试.这段过程给我 ...

  5. img 分区响应图

    ---恢复内容开始--- a标签的target为_blank属性,意为跳转到新的页面. shape要和coords配合使用,shape为rect时意义为矩形.shape 为不同属性时意为不同的形态触碰 ...

  6. java 封装,继承,多态基础

    什么是封装? 1,对象数据和在.操作该对象的指令都是对象自身的一部分,能够实现尽可能对外部隐藏数据. 2,实际项目开发中,使用封装最多的就是实体类. 什么是继承? 1,继承是面向对象程序设计能提高效率 ...

  7. 11th 最后的致意

    “终于我们不再是师生”,无论日后我们是否是师生,但这段经历是不可否认的,可以说软件工程这一门课程恐怕是我学生生涯中终生难忘的一段体验.即便不是从知识上,从另一个方面来讲,也教给了我一种做人做事的态度. ...

  8. HDU 2028 Lowest Common Multiple Plus

    http://acm.hdu.edu.cn/showproblem.php?pid=2028 Problem Description 求n个数的最小公倍数.   Input 输入包含多个测试实例,每个 ...

  9. Docker(二十四)-Docker使用Portainer搭建可视化界面

    Portainer介绍 Portainer是Docker的图形化管理工具,提供状态显示面板.应用模板快速部署.容器镜像网络数据卷的基本操作(包括上传下载镜像,创建容器等操作).事件日志显示.容器控制台 ...

  10. 群里提到的IE设置问题 ---B/S 下页面刷新问题

    这里面四个选项的含义 下面是每个选项的作用和意义: 1. “每次访问此页时检查”选项表示浏览器每次访问一个页面时,不管浏览器是否缓存过此页面,都要向服务器发出访问请求.这种设置的优点是实时性很强,肯定 ...