ES6 object.defineProperty
Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象。
Object.defineProperty(obj, prop, descriptor)
参数:
obj 要在其上定义属性的对象。
prop 要定义或修改的属性的名称。
descriptor 将被定义或修改的属性描述符。
前两个参数是常见的参数,就不多说了,主要来看第三个参数。
属性描述符
对象里目前存在的属性描述符有两种主要形式:数据描述符和存取描述符。
数据描述符是一个具有值的属性,该值可能是可写的,也可能不是可写的。
存取描述符是由getter-setter函数对描述的属性。描述符必须是这两种形式之一;不能同时是两者。
数据描述符和存取描述符均具有以下可选键值(共同具有):
configurable
当且仅当该属性的 configurable 为 true 时,该属性
描述符才能够被改变,同时该属性也能从对应的对象上被删除。默认为 false。
enumerable
当且仅当该属性的
enumerable为true时,该属性才能够出现在对象的枚举属性中。默认为 false。
数据描述符具有以下可选键值:
value
该属性对应的值。可以是任何有效的 JavaScript 值(数值,对象,函数等)。
默认为 undefined。
writable
当且仅当该属性的
writable为true时,value才能被赋值运算符改变。默认为 false。
存取描述符同时具有以下可选键值:
get
一个给属性提供 getter 的方法,如果没有 getter 则为
undefined。当访问该属性时,该方法会被执行,方法执行时没有参数传入,但是会传入this对象(由于继承关系,这里的this并不一定是定义该属性的对象)。默认为 undefined。
set
一个给属性提供 setter 的方法,如果没有 setter 则为
undefined。当属性值修改时,触发执行该方法。该方法将接受唯一参数,即该属性新的参数值。默认为 undefined。
看完上面这些,可能会有点懵,到底什么是数据描述符,什么是存取描述符呢?我是这样理解:
拥有value,writeable的描述符就是数据描述符;拥有get,set的描述符就是存取描述符。
这些选项不一定是自身属性,如果是继承来的也要考虑。
如果一个描述符不具有value,writable,get 和 set 任意一个关键字,那么它默认就是一个数据描述符。
一个描述符中不能同时有(value或writable)和(get或set)关键字,也就是一个描述符要么是拥有value,writable的数据描述符,要么是拥有get,set存取描述符。
ES6 object.defineProperty的更多相关文章
- ES6 Object.setPrototypeOf ()方法和defineProperty()方法的使用
将一个指定的对象的原型设置为另一个对象或者null(既对象的[[Prototype]]内部属性). 示例: <script type="text/javascript"> ...
- javascript之Object.defineProperty的奥妙
直切主题 今天遇到一个这样的功能: 写一个函数,该函数传递两个参数,第一个参数为返回对象的总数据量,第二个参数为初始化对象的数据.如: var o = obj (4, {name: 'xu', age ...
- es6 Object.assign
ES6 Object.assign 一.基本用法 Object.assign方法用来将源对象(source)的所有可枚举属性,复制到目标对象(target).它至少需要两个对象作为参数,第一个参数是目 ...
- est6 -- Object.is()、Object.assign()、Object.defineProperty()、Symbol、Proxy
Object.is()用来比较两个值是否严格相等.它与严格比较运算符(===)的行为基本一致,不同之处只有两个:一是+0不等于-0,二是NaN等于自身. + === - //true NaN === ...
- es6 Object.assign ECMAScript 6 笔记(六) ECMAScript 6 笔记(一) react入门——慕课网笔记 jquery中动态新增的元素节点无法触发事件解决办法 响应式图像 弹窗细节 微信浏览器——返回操作 Float 的那些事 Flex布局 HTML5 data-* 自定义属性 参数传递的四种形式
es6 Object.assign 目录 一.基本用法 二.用途 1. 为对象添加属性 2. 为对象添加方法 3. 克隆对象 4. 合并多个对象 5. 为属性指定默认值 三.浏览器支持 ES6 O ...
- 关于Object.defineProperty 的基础知识
Object.defineProperty 这个方法大家耳熟能详,可以对 对象的属性进行添加或修改的操作.即可以进行 数据劫持 .vue就是通过这个方法来劫持数据的. 平时我们创建对象的时候,一般通 ...
- Object.defineProperty()方法学习笔记
这是js中一个非常重要的方法,ES6中某些方法的实现依赖于它,VUE通过它实现双向绑定 此方法会直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象 参数 Object.def ...
- js中Object.defineProperty()方法的解释
菜菜: “老大,那个, Object.defineProperty 是什么鬼?” 假设我们有个对象 user ; 我们要给它增加一个属性 name , 我们会这么做 1 2 3 var user = ...
- 双向绑定Proxy VS Object.defineProperty
Vue3.0的双向绑定将使用Proxy代替Object.defineProperty,据尤大说,速度提升了1倍. 本文我们来探讨一下Proxy对比Object.defineProperty究竟有哪些优 ...
随机推荐
- PHP、TP6框架及JavaScript的单步调试
目录 一.PHP程序的调试 1. 单个PHP程序的调试 2. PHP框架代码的调试 二.JavaScript程序的调试 三.总结 参考资料:https://www.bilibili.com/video ...
- 《手把手教你》系列技巧篇(四十二)-java+ selenium自动化测试 - 处理iframe -下篇(详解教程)
1.简介 经过宏哥长时间的查找,终于找到了一个含有iframe的网页.所以今天这一篇的主要内容就是用这个网页的iframe,宏哥给小伙伴或者童鞋们演示一下,在处理过程中遇到的问题以及宏哥是如何解决的. ...
- java更开源-安全可靠国产系统背景下的应有.NET Core的一席之地
"安可"背景下的中国软件开发 在中美当前背景下的安全可靠国产系统(简称安可),安可产业要实现技术自主可控,需要在四个层面逐步实现:基础硬件设施,如芯片.服务器.存储.交换机.路由器 ...
- 编译使用nginx
nginx-1.18.0 ./configure --prefix=$HOME/nginx --with-http_ssl_module make -j32; make install [fangju ...
- react之路由
功能:让用户从一个视图(组件)导航到另一个视图(组件) 前端路由是一套映射规则,在React中,是URL路径与组件的对应关系 使用React路由简单来说,就是配置路径和组件 路由的使用 1.安装路由 ...
- [atARC115D]Odd Degree
考虑对于一棵树$G$,这个问题的答案-- 当$k$为奇数时答案显然为0,否则从$V$中任选$k$个点,以任意一点为根,从底往上不难发现子图数量唯一 换言之,当$k$为偶数时,每一个合法(恰有$k$个奇 ...
- [SQL Server]一列多行转换为字符串
在 SQL Server 中,如何将多行数据变成一个字符串保存. skill 投石 挖矿 刮痧 上面三行数据想要得到结果为:投石,挖矿,刮痧 有两种方式: 拼接字符串. 使用 for XML 首先创建 ...
- Redis、Zookeeper实现分布式锁——原理与实践
Redis与分布式锁的问题已经是老生常谈了,本文尝试总结一些Redis.Zookeeper实现分布式锁的常用方案,并提供一些比较好的实践思路(基于Java).不足之处,欢迎探讨. Redis分布式锁 ...
- DirectX12 3D 游戏开发与实战第八章内容(上)
8.光照 学习目标 对光照和材质的交互有基本的了解 了解局部光照和全局光照的区别 探究如何用数学来描述位于物体表面上某一点的"朝向",以此来确定入射光照射到表面的角度 学习如何正确 ...
- Git常用操作(二)
仓库拉取 git clone XXX 修改仓库链接 $ git config -l # 显示coding列表 $ git config --get remote.origin.url # 返回orig ...