for in,Object.keys和Object.getOwnPropertyNames的区别
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.keys是es5中新增的方法,用来获取对象自身可枚举的属性键。
console.log(Object.keys(child));
// > ["b"]
可以看出Object.keys的效果和for in+hasOwnProperty的效果是一样的。
Object.getOwnPropertyNames
Object.getOwnPropertyNames也是es5中新增的方法,用来获取对象自身的全部属性名。
console.log(Object.getOwnPropertyNames(child));
// > ["b", "c"]
总结
而遍历对象有5种方法:
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的区别的更多相关文章
- JavaScript中in操作符(for..in)、Object.keys()和Object.getOwnPropertyNames()的区别
ECMAScript将对象的属性分为两种:数据属性和访问器属性.每一种属性内部都有一些特性,这里我们只关注对象属性的[[Enumerable]]特征,它表示是否通过 for-in 循环返回属性,也可以 ...
- [转] JavaScript中in操作符(for..in)、Object.keys()和Object.getOwnPropertyNames()的区别
ECMAScript将对象的属性分为两种:数据属性和访问器属性.每一种属性内部都有一些特性,这里我们只关注对象属性的[[Enumerable]]特征,它表示是否通过 for-in 循环返回属性,也可以 ...
- 小tips:JS之for in、Object.keys()和Object.getOwnPropertyNames()的区别
for..in循环 使用for..in循环时,返回的是所有能够通过对象访问的.可枚举的属性,既包括存在于实例中的属性,也包括存在于原型中的实例.这里需要注意的是使用for-in返回的属性因各个浏览器厂 ...
- or in 、Object.keys()以及Object.getOwnPropertyNames有什么区别?
or in .Object.keys()以及Object.getOwnPropertyNames的区别 var obj= Object.create(parent, { b: { value: 2, ...
- 遍历对象属性(for in、Object.keys、Object.getOwnProperty)
js中几种遍历对象的方法,包括for in.Object.keys.Object.getOwnProperty,它们在使用场景方面各有不同. for in 主要用于遍历对象的可枚举属性,包括自有属性. ...
- js 遍历对象属性(for in、Object.keys、Object.getOwnProperty) 以及高效地输出 js 数组
js中几种遍历对象的方法,包括for in.Object.keys.Object.getOwnProperty,它们在使用场景方面各有不同. for in 主要用于遍历对象的可枚举属性,包括自有属性. ...
- 关于Object.keys()和for in的区别
今天见到一道面试题让说一说Object.keys()和for in的区别,顿时有些发懵“What's Object.keys?”我立马上网搜了一下,大致作用也是做遍历,参数是一个对象,返回值是一个数组 ...
- 关于Object.keys()和Object.values()的使用
关于Object.keys()和Object.values()的使用 1. 关于Object.keys() 1) 处理对象,返回可枚举的所有可枚举属性的字符串数组 let person ={ name ...
- Object.keys、Object.getOwnPropertyNames区别
用途 Object.keys 定义:返回一个对象可枚举属性的字符串数组: Object.getOwnPropertyNames 定义:返回一个对象可枚举.不可枚举属性的名称: 属性的可枚举性.不可枚举 ...
随机推荐
- R绘图 第十篇:绘制文本、注释和主题(ggplot2)
使用ggplot2包绘制时,为了更直观地向用户显示报表的内容和外观,需要使用geom_text()函数添加文本说明,使用annotate()添加注释,并通过theme()来调整非数据的外观. 一,文本 ...
- 你应该知道Go语言的几个优势
要说起GO语言的优势,我们就得从GO语言的历史讲起了-- 本文由腾讯技术工程官方号发表在腾讯云+社区 2007年,受够了C++煎熬的Google首席软件工程师Rob Pike纠集Robert Grie ...
- java实现基于关键字的文件夹(文件)的搜索、文件夹(文件)的复制、删除
最近在做一个项目,需要实现这几项功能,上网查了很多资料,自己研究了好几天终于实现了,现在与大家分享一下. 一.JAVA实现文件夹的搜索 在百度搜索N个技术文章,从哪些大牛们共享的资料中终于写出了我 ...
- 解决coursera无法观看视频的问题
问题 最近开始看coursera的一个课程,遇到一个问题,可以正常登录网站(未使用VPN),也可以下载资源(除了视频)但是却没有办法在线观看视频. 解决方法 使用VPN 这个方法应该可以解决任何访问国 ...
- Qt连接数据库的两种方法
我曾经想过,无论在哪个平台下开发,都不要再接触SQL Server了,但显然不行.我们是来看世界的,不是来改变世界的,想通就好. 前两天,尝试了一下Qt下远程访问数据库.在macOS下,用Qt 5.1 ...
- linux centos 中Tomcat的安装和自启动配置
Tomcat的安装和自启动配置将tomcat添加为linux系统服务,网上找到了很多方法,其中比较简单的如下:方法一:(亲测有效)1. 首先需要将$Tomcat_HOME/bin目录下的catalin ...
- mac10.12.6系统配置clion编写CMakeLists文件运行opencv3
按照mac10.12.6系统使用cmake安装opencv3.3.0+opencv_contrib-3.3.0下载编译安装好了文件以后,装好clion编译器,新建C++可执行工程,编写代码 opecv ...
- unity中利用纯物理工具制作角色移动跳跃功能
using System.Collections;using System.Collections.Generic;using UnityEngine; public class Player : M ...
- openstack horizon 开发第二天
依照上次的简单的仪表盘添加动作额外添加或修改的文件mydashboard/├── mypanel│ ├── forms.py│ ├── tables.py│ ├── templates│ ...
- PowerDesigner数据库设计实用技巧
欢迎大家补充,谢谢! 1. 原始单据与实体之间的关系 可以是一对一.一对多.多对多的关系.在一般情况下,它们是一对一的关系:即一张原始单据对应且只对应一个实体.在特殊情况下,它们可能是一对多或多对一的 ...