愉快的中秋节要过去了,国庆倒计时两个周!!!

  闲话不多说,那今天我们来看一看JS中枚举对象属性的方法有哪些以及他们的区别

  首先在JS里面枚举对象属性一共有三种方法

    for in: 会遍历对象中所有的可枚举属性(包括自有属性和继承属性)

    Object.keys(): 会返回一个包括所有的可枚举的自有属性的名称组成的数组

    Object.getOwnPropertyNames(): 会返回自有属性的名称 (不管是不是可枚举的)

   下面我们一个一个的拆解开来看一下

  for in:

     会遍历对象中所有的可枚举属性(包括自有属性和继承属性)

  例:

  1. var obj = {
  2. itemA: 'itemA',
  3. itemB: 'itemB'
  4. }
  5. var newObj = Object.create(obj) // 使用Object.create创建一个原型为obj的对象
  6. newObj.newItemA = 'newItemA'
  7. newObj.newItemB = 'newItemB'
  8. for(i in newObj){
  9. console.log(i)
  10. }

  输出结果为:

  1. newItemA
  2. newItemB
  3. itemA
  4. itemB

  现在我们将其中的一个属性变为不可枚举属性

  1. var obj = {
  2. itemA: 'itemA',
  3. itemB: 'itemB'
  4. }
  5. var newObj = Object.create(obj) // 使用Object.create创建一个原型为obj的对象
  6. newObj.newItemA = 'newItemA'
  7. newObj.newItemB = 'newItemB'
  8. Object.defineProperty(newObj,'newItemA',{
  9. enumerable: false
  10. })
  11.  
  12. for(i in newObj){
  13. console.log(i)
  14. }

  输出结果:

  1. newItemB
  2. itemA
    itemB

  Object.keys():

    会返回一个包括所有的可枚举的自有属性的名称组成的数组

    例:

  1. var obj = {
  2. itemA: 'itemA',
  3. itemB: 'itemB'
  4. }
  5. var newObj = Object.create(obj) // 使用Object.create创建一个原型为obj的对象
  6. newObj.newItemA = 'newItemA'
  7. newObj.newItemB = 'newItemB'
  8. Object.defineProperty(newObj,'newItemA',{
  9. enumerable: false
  10. })
  11. var result = Object.keys(newObj)
  12. console.log(result)

    结果:

  1. ['newItemB']

  

   Object.getOwnPropertyNames():

    会返回自有属性的名称 (不管是不是可枚举的)

    例:

  1. var obj = {
  2. itemA: 'itemA',
  3. itemB: 'itemB'
  4. }
  5. var newObj = Object.create(obj) // 使用Object.create创建一个原型为obj的对象
  6. newObj.newItemA = 'newItemA'
  7. newObj.newItemB = 'newItemB'
  8. Object.defineProperty(newObj,'newItemA',{
  9. enumerable: false
  10. })
  11. var result = Object.getOwnPropertyNames(newObj)
  12. console.log(result)

    结果:

  1. ['newItemA','newItemB']

 搞定收工,明天又要去上班喽,老铁们,得劲吗

JS枚举对象属性的方法及其区别的更多相关文章

  1. JavaScript 访问对象属性和方法及区别

    这篇文章主要介绍了浅析JavaScript访问对象属性和方法及区别的相关资料,仅供参考 属性是一个变量,用来表示一个对象的特征,如颜色.大小.重量等:方法是一个函数,用来表示对象的操作,如奔跑.呼吸. ...

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

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

  3. js object 对象 属性和方法的使用

    //object 对象 属性和方法的使用 var person = new Object(); person.name="张海"; person.age="; perso ...

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

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

  5. 浅析JavaScript访问对象属性和方法及区别

    属性是一个变量,用来表示一个对象的特征,如颜色.大小.重量等:方法是一个函数,用来表示对象的操作,如奔跑.呼吸.跳跃等. 在JavaScript中通常使用”."运算符来存取对象的属性的值.或 ...

  6. 【repost】js window对象属性和方法相关资料整理

    window对象有以下方法: open close alert confirm prompt setTimeout clearTimeout setInterval clearInterval mov ...

  7. Js基础知识7-JavaScript所有内置对象属性和方法汇总

    对象什么的,程序员可是有很多呢... JS三大对象 对象,是任何一个开发者都无法绕开和逃避的话题,她似乎有些深不可测,但如此伟大和巧妙的存在,一定值得你去摸索.发现.征服. 我们都知道,JavaScr ...

  8. js函数的属性和方法

    js函数的属性和方法 前面的话 函数是javascript中特殊的对象,可以拥有属性和方法,就像普通的对象拥有属性和方法一样.甚至可以用Function()构造函数来创建新的函数对象.本文是深入理解j ...

  9. getSelection、range 对象属性,方法理解,解释

    网上转了一圈发现没有selection方面的解释,自己捣鼓下 以这段文字为例子.. <p><b>法国国营铁路公司(SNCF)20日承认,</b>新订购的2000列火 ...

随机推荐

  1. Unix-IO-同步,异步,阻塞,非阻塞-笔记篇

    概念更正 https://www.zhihu.com/question/19732473 错误的四个象限分类 https://www.ibm.com/developerworks/cn/linux/l ...

  2. bootstrape select使用小结

    看看上面的效果是bootstrape使用的效果.虽然不是很好看,但是符合bootstrape的风格.来看看普通的select的样式 bootstrape下的select和普通select在bootst ...

  3. 开发规范 小白进阶 python代码规范化

    开发规范 软件开发,规范项目的目录结构,代码规范,遵循 PeP8规范等等,让你更加清晰的,合理开发 一功能分类(文件名) settings.py配置文件 配置文件放一些静态参数, 划归固定的路径,文件 ...

  4. pip安装第三方库

    不是所有的第三方Python包都能通过pip来安装,只能是发布在pypi.org上面的才能通过pip安装. pypi是什么? pypi是一个仓库,上面存放了大量的Python第三方软件包,是由Pyth ...

  5. C语言编程入门之--第五章C语言基本运算和表达式-part4

    5.3.5 和二进制极为密切的运算符 本小节的运算符需要借助二进制概念来理解. 二进制数据中,比如一个字节的数据,它的十进制为228,二进制就为11100100,如图5.11, 注意:如果不懂怎么转换 ...

  6. The used SELECT statements have a different number of columns???

    今天我们组就我一个人留守在这里修复bug了,有点小悲伤啊,他们都问我能不能hold得住啊,我当然能hold得住啊: 在看一个入库的存储过程中,在数据库运行的时候是没问题的,项目已启动,进行入库操作就是 ...

  7. SpringCloud阶段总结

    学习时间:8.15 -- 8.29 学习目标:了解SpringCloud常见组件的使用 学习方式: 输入:视频+博客+开源项目代码参考 输出:调试代码+写博客输出 组件列表 服务注册:Eureka 客 ...

  8. vs2019+cmake实现Linux远程开发

    在上一篇文章中我们介绍了使用vs2019作为远程Linux系统的开发环境,但我们是创建的传统的sln项目,而对于Linux开发者来说以autotools或是cmake进行项目结构的组织更为简单直观,也 ...

  9. Count the string[KMP]HDU3336

    题库链接http://acm.hdu.edu.cn/showproblem.php?pid=3336 这道题是KMP的next数组的一个简单使用,首先要理解next数组的现实意义:next[i]表示模 ...

  10. python学习——面向对象编程

    关于python面向对象编程,请参考: https://blog.csdn.net/zhoudaxia/article/details/23341261