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通过多种方式来加强对象的使用,通过简单的语法扩展,提供更多操作对象及与对象 ...
随机推荐
- ThinkPHP中处理Layout模板的问题
ThinkPHP中的模板引擎内置了布局模板功能支持,可以方便实现嵌套. 其中有两种布局方式,一种为以布局模板为入口的布局方式,但是需要开启LAYOUT_ON 参数(默认不开启) 并且设置布局入口文件名 ...
- c语言贪吃蛇详解3.让蛇动起来
c语言贪吃蛇详解3.让蛇动起来 前几天的实验室培训课后作业我布置了贪吃蛇,今天有时间就来写一下题解.我将分几步来教大家写一个贪吃蛇小游戏.由于大家c语言未学完,这个教程只涉及数组和函数等知识点. 上次 ...
- Webapi调用
C# webapi 路由名称不能跟area名称相同,否则出现404 action找不到的问题???
- python中的“.T”操作
其实就是对一个矩阵的转置 看代码: a array([[1, 2, 3], [4, 5, 6], [7, 8, 9]]) a.T array([[1, 4, 7], [2, 5, 8], [3, 6, ...
- QTP生成随机数字+字母
以下函数实现随机生成17位数(包括字母和数字),仍有改进的空间,可根据具体要求适当修改 Dim targetstring '调用返回函数给变量.Function过程通过函数名返回一个值 targets ...
- 学习用java基于webMagic+selenium+phantomjs实现爬虫Demo爬取淘宝搜索页面
由于业务需要,老大要我研究一下爬虫. 团队的技术栈以java为主,并且我的主语言是Java,研究时间不到一周.基于以上原因固放弃python,选择java为语言来进行开发.等之后有时间再尝试pytho ...
- Netty与传统Server对比
前言 本文旨在介绍传统Socket服务端与NIO服务端的差异. 以餐厅服务员简单举例,每个客人对应一个请求. 传统Socket / OIO public class OioServer { @Supp ...
- VantPy自动化测试框架
1.必须要谈的一点,就是我们学习自动测试不是用来炫耀的,而是用来提升自身能力的. 2.这个框架不是通用框架,只是在这里灌输这个框架的思想,让每个人写框架都易如反掌 3.如果没有python基础的同学, ...
- Linux下一次删除百万文件
Linux下一次删除百万文件 线上环境遇到的一个问题,文件数量过多,执行rm命令报错 # rm -f ./* -bash: /bin/rm: Argument list too long 根据报错检查 ...
- 谷哥的小弟学前端(11)——JavaScript基础知识(2)
探索Android软键盘的疑难杂症 深入探讨Android异步精髓Handler 具体解释Android主流框架不可或缺的基石 站在源代码的肩膀上全解Scroller工作机制 Android多分辨率适 ...