最近面试遇到问如何获取对象全部属性名的方法,总结一下:

对象属性类型分类:

1.ESMAScript分类

  1. 数据类型 又分为可枚举和不可枚举类型
  2. 访问器类型

2.上下文分类

  1. 原型属性
  2. 实例属性

1.列举自身但不包括原型的可枚举属性名 Object.keys(obj)

  1. // 遍历对象
  2. function Person(name, age) {
  3. this.name = name;
  4. this.age = age;
  5. }
  6. Person.prototype.demo = function() {};
  7. let cj = new Person('cj', 25);
  8. // 通过Object.defineProperty定义一个不可枚举属性
  9. Object.defineProperty(cj, 'weight', {
  10. enumerable:false
  11. })
  12. // enumerable = true
  13. // console.log(Object.keys(cj)) // name age
  14. // enumerable = false
  15. // console.log(Object.keys(cj)) // name age weight

2.列举包括自身不可枚举但不包括原型的属性名 Object.getOwnPropertyNames(obj)

  1. function Person(name, age) {
  2. this.name = name;
  3. this.age = age;
  4. }
  5. // 设置原型属性
  6. Person.prototype.demo = function() {};
  7. let cj = new Person('cj', 25);
  8. // 通过Object.defineProperty定义一个不可枚举属性
  9. Object.defineProperty(cj, 'weight', {
  10. enumerable:false
  11. })
  12. // 获取属性名
  13. console.log(Object.getOwnPropertyNames(cj)) // name age weight

3.获取自身和原型链上的可枚举属性 for in 返回的顺序可能与定义顺序不一致

  1. function Person(name, age) {
  2. this.name = name;
  3. this.age = age;
  4. }
  5. // 设置原型属性
  6. Person.prototype.demo = function() {};
  7. Object.prototype.j = 1
  8. let cj = new Person('cj', 25);
  9. // 通过Object.defineProperty定义一个不可枚举属性
  10. Object.defineProperty(cj, 'weight', {
  11. enumerable:false
  12. })
  13. let props = []
  14. for(prop in cj){
  15. props.push(prop)
  16. }
  17. console.log(props) //name age weight j

4.获取自身Symbol属性 Object.getOwnPropertySymbols(obj)

  1. let obj = {};
  2. // 为对象本身添加Symbol属性名
  3. let a = Symbol("a");
  4. obj[a] = "localSymbol";
  5. // 为对象原型添加Symbol属性名
  6. let b = Symbol("b")
  7. Object.prototype[b] = 111
  8. let objectSymbols = Object.getOwnPropertySymbols(obj);
  9. console.log(objectSymbols); //Symbol(a)

5.获取自身包括不可枚举和Symbol属性名,但不包括原型 Reflect.ownKeys(obj)

  1. // 遍历对象
  2. function Person(name, age) {
  3. this.name = name;
  4. this.age = age;
  5. }
  6. Person.prototype.demo = function() {};
  7. let s = Symbol('s')
  8. let cj = new Person('cj', 25);
  9. // 通过Object.defineProperty定义一个不可枚举属性
  10. Object.defineProperty(cj, 'weight', {
  11. enumerable: false
  12. })
  13. cj[s] = 1
  14. let a = Symbol('a')
  15. Object.prototype[a] = 1
  16. console.log(Object.getOwnPropertyNames(cj)) //name age weight
  17. console.log(Reflect.ownKeys(cj)) //name age weight Symbol(s)

JS获取对象属性名小结的更多相关文章

  1. js 获取对象属性个数

    js 获取对象属性个数 方法一: var attributeCount = function(obj) { var count = 0; for(var i in obj) { if(obj.hasO ...

  2. js获取对象属性的两种方法,object.属性名,[‘属性名’ ]

    1.通过点的方式 2.通过括号的方式 例: <input type="text" value="hello" id="text"/&g ...

  3. JS获取对象“属性和方法”的方法

    平时在写的代码过程中,经常会遇到对对象Object的数据处理.而在对对象的数据处理中,操作最频繁的是“数据引用”.“值的修改”.“获取关键字(属性)”.平时最烦的也是“获取关键字”,经常忘记怎么去获取 ...

  4. JS获取对象“属性”的方法

    var testObj= new Object(); testObj.name = "shangguan"; testObj.age= ; testObj.action = fun ...

  5. js 更改对象属性名

    来自:https://segmentfault.com/q/1010000011923504 侵删 [ { "Id":"3972679ef2c04151972b376dd ...

  6. js 获取 对象 属性名称(转载)

    来源:https://www.cnblogs.com/YuyuanNo1/p/9257634.html dataObj = {name : su,age : 26,height : 18cm }; f ...

  7. JS中isPrototypeOf 和hasOwnProperty 的区别 ------- js使用in和hasOwnProperty获取对象属性的区别

    JS中isPrototypeOf 和hasOwnProperty 的区别 1.isPrototypeOf isPrototypeOf是用来判断指定对象object1是否存在于另一个对象object2的 ...

  8. js获取对象的属性个数

    for (var i = 0; i < dt.length; i++) { if (Object.keys(dt[i]).length <= 1) { dt.splice(i, 1); i ...

  9. JS 对象属性名排序

    问题,对象属性名排序,如: var data = { A:[], D:[], B:{} } 调整为=> var data = { A:[], B:[], D:{} } 方法一: for,in,把 ...

随机推荐

  1. office常用技巧汇总

    1.excel篇 (1)一次选择多行 可以利用SHIFT+鼠标实现,点第一行,按下鼠标,点200行,就能实现1~200行选择了. 总结:就是一直按住shift键,鼠标点击要选择的首行,再点击尾行.

  2. 【HTML】前台input上传限制文件类型

    仅限制xls文件上传 <input id="uploadSkufile" type="file" value="批量导入" style ...

  3. Lambda表达式的用法

    参考:https://www.cnblogs.com/knowledgesea/p/3163725.html

  4. 微服务架构 ------ 插曲 Linux平台 Ubuntu的安装

    1.一定要通过自定义安装 2.选择的硬件兼容性选择 14.x   这里介绍一下红框内的东西,是为了做虚拟存储使用的,也就是一批服务器对外展示位一个服务器,类似于服务器集群 3.选择稍后安装操作系统,如 ...

  5. 在verilog中使用格雷码

    格雷码的一些知识: https://baike.baidu.com/item/%E6%A0%BC%E9%9B%B7%E7%A0%81/6510858?fr=aladdin 绿色框起来的是0--15的格 ...

  6. c/c++程序中内存区划分

    转自:http://wenzongliang.iteye.com/blog/1866629 操作系统启动程序时会加载程序代码到内存(叫程序的代码区),然后创建进程PCB为进程分配内存资源(数据区,32 ...

  7. APP手势密码绕过

    之前写的文章收到了很多的好评,主要就是帮助到了大家学习到了新的思路.自从发布了第一篇文章,我就开始筹备第二篇文章了,最终打算在07v8首发,这篇文章我可以保障大家能够学习到很多思路.之前想准备例子视频 ...

  8. MySQL连接超时处理

    1.由于MySQL默认是8小时的wait_timeout,当超过8小时的连接时间后,在JAVA中调用将出现如下报错 SEVERE EXCEPTION com.mysql.jdbc.exceptions ...

  9. 景点API支持查询携程旅游门票景点详情

    门票景点详情,景点api支持查询携程旅游门票景点详情. 接口名称:景点api 接口平台:开放api 接口地址:http://api2.juheapi.com/xiecheng/senicspot/ti ...

  10. 【SSH错误】ssh_exchange_identification: read: Connection reset by peer

    进行远程登录时,ssh root@xxxxxxxxx出现如下错误 ssh_exchange_identification: read: Connection reset by peer 解决方案:登录 ...