Object.keys() 和 Object.getOwnPropertyNames() 的区别详解


Posted in Javascript onMay 21, 2020

大部分情况下Object.getOwnPropertyNames()与Object.keys(obj)的功能是一样的,我们一般也是用来获取一个JSON对象中所有属性,例如

const obj = {
  property1: 1,
  property2: 2,
};

console.log(Object.keys(obj));
console.log(Object.getOwnPropertyNames(obj));

输出:

> Array ["property1", "property2"]
> Array ["property1", "property2"]

Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和正常循环遍历该对象时返回的顺序一致 。

Object.getOwnPropertyNames()方法返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括Symbol值作为名称的属性)组成的数组。

共同点:都是返回自身的属性,不会返回原型链上的。

区别: Object.keys()返回可枚举的,Object.getOwnPropertyNames()返回所有的。

Person = function(name){
  this.name = name || ''
}
Person.prototype.sayHello = function(){
  console.log('hello')
}
p = new Person('yangyang')
p.age = 18
Object.defineProperties(p, {
  age:{
    enumerable:false
  }
})
console.log(Object.keys(p)) // ["name"]
console.log(Object.getOwnPropertyNames(p)) // ["name", "age"]

参考资料:
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/keys
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames

到此这篇关于Object.keys() 和 Object.getOwnPropertyNames() 的区别详解的文章就介绍到这了,更多相关Object.keys()和Object.getOwnPropertyNames()内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
jquery中dom操作和事件的实例学习-表单验证
Nov 30 Javascript
Jquery实现弹出层分享微博插件具备动画效果
Apr 03 Javascript
Extjs中RowExpander控件的默认展开问题示例探讨
Jan 24 Javascript
Node.js中使用事件发射器模式实现事件绑定详解
Aug 15 Javascript
将angular-ui的分页组件封装成指令的方法详解
May 10 Javascript
JS实现延迟隐藏功能的方法(类似QQ头像鼠标放上展示信息)
Dec 28 Javascript
10行原生JS实现文字无缝滚动(超简单)
Jan 02 Javascript
Vue 实现树形视图数据功能
May 07 Javascript
如何把vuejs打包出来的文件整合到springboot里
Jul 26 Javascript
layui的数据表格+springmvc实现搜索功能的例子
Sep 28 Javascript
ES6 Object.assign()的用法及其使用
Jan 18 Javascript
vue内置组件component--通过is属性动态渲染组件操作
Jul 28 Javascript
JavaScript实现HSL拾色器
May 21 #Javascript
js实现拾色器插件(ColorPicker)
May 21 #Javascript
原生js实现日期选择插件
May 21 #Javascript
vue+Element中table表格实现可编辑(select下拉框)
May 21 #Javascript
浅谈React中组件逻辑复用的那些事儿
May 21 #Javascript
记一次用ts+vuecli4重构项目的实现
May 21 #Javascript
JS实现图片幻灯片效果代码实例
May 21 #Javascript
You might like
PHP生成HTML静态页面实例代码
2008/08/31 PHP
php通过Chianz.com获取IP地址与地区的方法
2015/01/14 PHP
PHP函数checkdnsrr用法详解(Windows平台用法)
2016/03/21 PHP
Laravel框架实现的上传图片到七牛功能详解
2019/09/06 PHP
不同Jquery版本引发的问题解决
2013/10/14 Javascript
css与javascript跨浏览器兼容性总结
2014/09/15 Javascript
js实现的tab标签切换效果代码分享
2015/08/25 Javascript
node.js从数据库获取数据
2016/05/08 Javascript
jQuery与js实现颜色渐变的方法
2016/12/30 Javascript
bootstrap3-dialog-master模态框使用详解
2017/08/22 Javascript
微信小程序 input表单与redio及下拉列表的使用实例
2017/09/20 Javascript
node.js支持多用户web终端实现及安全方案
2017/11/29 Javascript
php中and 和 &&出坑指南
2018/07/13 Javascript
vue中使用sessionStorage记住密码功能
2018/07/24 Javascript
vue element table中自定义一些input的验证操作
2020/07/18 Javascript
浅谈JavaScript中等号、双等号、 三等号的区别
2020/08/06 Javascript
详解vue组件之间的通信
2020/08/30 Javascript
[01:12](回顾)DOTA2国际邀请赛,全世界DOTAer的盛宴
2014/07/01 DOTA
Python实现动态添加类的属性或成员函数的解决方法
2014/07/16 Python
Python写的Socks5协议代理服务器
2014/08/06 Python
python的staticmethod与classmethod实现实例代码
2018/02/11 Python
python3+PyQt5实现自定义流体混合窗口部件
2018/04/24 Python
儿童python练习实例
2018/05/27 Python
浅谈python 导入模块和解决文件句柄找不到问题
2018/12/15 Python
解决pytorch报错:AssertionError: Invalid device id的问题
2020/01/10 Python
YOOX台湾:意大利奢侈品电商
2018/10/13 全球购物
凯蒂·佩里个人女鞋品牌:Katy Perry Collections
2019/04/04 全球购物
安德玛加拿大官网:Under Armour加拿大
2019/10/02 全球购物
高中毕业生自我鉴定
2013/11/03 职场文书
优秀公益广告词大全
2014/03/19 职场文书
学校党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
2015秋季开学典礼演讲稿
2015/07/16 职场文书
MySQL锁机制
2021/04/05 MySQL
利用Java设置Word文本框中的文字旋转方向的实现方法
2021/06/28 Java/Android
python实现剪贴板的操作
2021/07/01 Python
聊聊SpringBoot自动装配的魔力
2021/11/17 Java/Android