ES6 对象的扩展(下)
属性的可枚举性
对象的每个属性都有一个描述对象(Descriptor),用来控制该属性的行为。Object.getOwnPropertyDescriptor方法可以获取该属性的描述对象。
var obj = { foo: 123 };
Object.getOwnPropertyDescriptor(obj, 'foo')
// {value: 123, writable: true, enumerable: true, configurable: true}
var o = Object.defineProperty({}, 'display', {
enumerable: false,
value: 'block'
})
Object.getOwnPropertyDescriptor(o,'display')
// {value: "block", writable: false, enumerable: false, configurable: false}
ES5有三个操作,如果enumerable为false则对其不起作用:
- for...in循环:只遍历对象自身的和继承的可枚举的属性。
- Object.keys():返回对象自身的所有可枚举的属性的键名。
- JSON.stringify():只串行化对象自身的可枚举的属性。
ES6新增了两个操作,会忽略enumerable为false的属性。
- Object.assign():只拷贝对象自身的可枚举的属性。
- Reflect.enumerate():返回所有for...in循环会遍历的属性。
这五个操作之中,只有for...in和Reflect.enumerate()会返回继承的属性。
实际上,引入enumerable的最初目的,就是让某些属性可以规避掉for...in操作。比如,对象原型的toString方法,以及数组的length属性,就通过这种手段,不会被for...in遍历到。
Object.getOwnPropertyDescriptor(Object.prototype, 'toString').enumerable
// false
Object.getOwnPropertyDescriptor([], 'length').enumerable
// false
另外,ES6规定,所有Class的原型的方法都是不可枚举的。
Object.getOwnPropertyDescriptor(class {foo() {}}.prototype, 'foo').enumerable
// false
总的来说,操作中引入继承的属性会让问题复杂化,大多数时候,我们只关心对象自身的属性。所以,尽量不要用for...in循环,而用Object.keys()代替。
ES6 对象的扩展(下)的更多相关文章
- es6对象的扩展
对象(object)是 JavaScript 最重要的数据结构之一. object 在es6中新增了很多便利的方法 在es6中允许直接写入变量和方法的名称直接作为对象的属性 let x =1 ,y=2 ...
- Es6对象的扩展和Class类的基础知识笔记
/*---------------------对象的扩展---------------------*/ //属性简写 ,属性名为变量名, 属性值为变量的值 export default functio ...
- ES6对象的扩展及新增方法
1.属性的简洁表示法 ES6允许直接写入变量和函数,作为对象的属性和方法.这样的书写更加简洁. const foo = 'bar'; const baz = {foo}; baz//{foo:'bar ...
- web前端之es6对象的扩展
1.属性的简洁表示法 2.属性名表达式 表达式作为对象的属性名 3.方法的 name 属性 例如:函数的name 属性,返回函数名. 4.Object.is() ES 比较两个值是否相等,只有两个运算 ...
- es6 对象的扩展
一.现在还有很多浏览器不能直接使用es6语法.特别是手机端的一些低版本的浏览器.都需要用bale转换一下. 但是目前流行的框架中(vue,react,angular).都有自己的脚手架,都能用webp ...
- ES6 对象的扩展(上)
属性的简介表示法 允许直接写入变量和函数作为对象的属性和方法,这样的书写更简洁. function f( x, y ) { return { x, y }; } // 等同于 function f( ...
- ES6 对象的扩展 Object.assign()
Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target). const target = { a: 1 }; const source1 ...
- ES6 对象的扩展 Object.is()
ES5 比较两个值是否相等,只有两个运算符:相等运算符(==)和严格相等运算符(===).它们都有缺点,前者会自动转换数据类型,后者的NaN不等于自身,以及+0等于-0. ES6 提出“Same-va ...
- ES6对象扩展
前面的话 随着JS应用复杂度的不断增加,开发者在程序中使用对象的数量也在持续增长,因此对象使用效率的提升就变得至关重要.ES6通过多种方式来加强对象的使用,通过简单的语法扩展,提供更多操作对象及与对象 ...
随机推荐
- C# 通过url地址获取页面内容
using System.Net; using System.IO; HttpWebRequest request = (HttpWebRequest)WebRequest.Create(" ...
- Java 将两个有序数组合成为一个有序数组
基本思路 1.如果其中一个数组的元素均大于另一个数组的元素,则可以直接组合,不用拆分. 即:其中一个数组的第一个元素大于或者小于另一个数组的最后一个元素 2.若不满足1中的情况,则表明数组需要拆分,拆 ...
- Python——Scrapy初学
Scrapy是一个为了爬取网站数据,提取结构性数据而编写的应用框架.可以应用在包括数据挖掘,信息处理或存储历史数据等一系列的程序中.Scrapy最初是为了页面抓取(更确切来说, 网络抓取)所设计的,也 ...
- DOM操作中,遍历动态集合的注意事项。ex: elem.children
elem.childNodes和elem.children返回的都是动态集合. 动态集合(live collection): 不实际存储元素和属性值 每次访问集合都重新查找DOM树 遍历动态集合: ...
- 浏览器出现Cannot set property 'onclick' of null的问题
Part1: 当js文件放在head里面时,如果绑定了onclick事件,就会出现这样的错误, 是因为W3School的写法是浏览器先加载完按钮节点才执行的js,所以当浏览器自顶向下解析时,找不到on ...
- 《图解Spark:核心技术与案例实战》作者经验谈
1,看您有维护博客,还利用业余时间著书,在技术输出.自我提升以及本职工作的时间利用上您有没有什么心得和大家分享?(也可以包含一些您写书的小故事.)回答:在工作之余能够写博客.著书主要对技术的坚持和热爱 ...
- 双向bfs-八数码问题
[八数码][1] [1]: https://www.luogu.org/problem/show?pid=1379 其实除了搜索恶心一点,好像也没什么提高+的 bfs搜的是状态. 双向bfs同时从起点 ...
- sendGrid 纯文本的换行问题
项目中使用sendGrid发送邮件,并且要求纯文本格式,遇到了无法换行的问题(使用\r\n). 解决方案: 1. 在换行符前加空格(官方推荐的做法 https://sendgrid.com/docs/ ...
- Js 作用域与作用域链与执行上下文不得不说的故事 ⁄(⁄ ⁄•⁄ω⁄•⁄ ⁄)⁄
最近在研究Js,发现自己对作用域,作用域链,活动对象这几个概念,理解得不是很清楚,所以拜读了@田小计划大神的博客与其他文章,受益匪浅,写这篇随笔算是自己的读书笔记吧~. 作用域 首先明确一个概念,js ...
- 自己主动化 远程登陆linuxserver并运行命令 —— expect
原文地址:http://blog.csdn.net/wangyuling1234567890/article/details/41149429 LinuxserverA登陆LinuxserverB s ...