defineProperty
### Object.defineProperty()
https://segmentfault.com/a/1190000007434923
方法会直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象。
语法
Object.defineProperty(obj,prop,descriptor)
#### 参数
obj
需要定义属性的对象。
prop
需定义或修改的属性的名字。
descriptor
将被定义或修改的属性的描述符。
返回值
==返回传入函数的对象,即第一个参数obj==
```
value: 设置属性的值
writable: 值是否可以重写。true | false
enumerable: 目标属性是否可以被枚举。true | false
configurable: 目标属性是否可以被删除或是否可以再次修改特性 true | false
```
001 writable default : false
当writable 为false 时 属性值不允许被修改
```
01:
var obj={};
Object.defineProperty(obj,"a",
{
value:1
});
obj.a++;
console.dir(obj.a); // 1
02:
var obj={};
Object.defineProperty(obj,"a",
{
value:"shangyy,
writable:true
});
obj.a="huyating";
console.dir(obj.a); //huyating
```
002 enumerable 默认为false 是否允许属性被遍历
```
01:
var obj={uname:"shangyy",age:18};
Object.defineProperty(obj,"a",
{
value:1,
writable:false,
enumerable:false
});
console.dir(Object.keys(obj)); // 0: "uname" 1: "age"
var obj={uname:"shangyy",age:18};
Object.defineProperty(obj,"a",
{
value:1,
writable:false,
enumerable:false
});
console.dir(Object.keys(obj)); // 0: "uname" 1: "age" 2:"a"
```
003 configurable
是否可以删除目标属性或是否可以再次修改属性的特性(writable, configurable, enumerable)。设置为true可以被删除或可以重新设置特性;设置为false,不能被可以被删除或不可以重新设置特性。默认为false。
这个属性起到两个作用:
目标属性是否可以使用delete删除
目标属性是否可以再次设置特性
var obj = {}
#### 001 测试目标属性是否能被删除
```
//第一种情况:configurable设置为false,不能被删除。
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:false,
enumerable:false,
configurable:false
});
//删除属性
delete obj.newKey;
console.log( obj.newKey ); //hello
//第二种情况:configurable设置为true,可以被删除。
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:false,
enumerable:false,
configurable:true
});
//删除属性
delete obj.newKey;
console.log( obj.newKey ); //undefined
```
002 测试是否可以再次修改特性
```
//第一种情况:configurable设置为false,不能再次修改特性。
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:false,
enumerable:false,
configurable:false
});
//重新修改特性
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:true,
enumerable:true,
configurable:true
});
console.log( obj.newKey ); //报错:Uncaught TypeError: Cannot redefine property: newKey
//第二种情况:configurable设置为true,可以再次修改特性。
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:false,
enumerable:false,
configurable:true
});
//重新修改特性
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:true,
enumerable:true,
configurable:true
});
console.log( obj.newKey ); //hello
```
#### ****getter或setter
==注意:当使用了getter或setter方法,不允许使用writable和value这两个属性==
注意:get或set不是必须成对出现,任写其一就可以。如果不设置方法,则get和set的默认值为undefined
```
var obj = {};
var initValue = 'hello';
Object.defineProperty(obj,"newKey",{
get:function (){
//当获取值的时候触发的函数
return initValue;
},
set:function (value){
//当设置值的时候触发的函数,设置的新值通过参数value拿到
initValue = value;
}
});
//获取值
console.log( obj.newKey ); //hello
//设置值
obj.newKey = 'change value';
console.log( obj.newKey ); //change value
```
defineProperty的更多相关文章
- javascript之Object.defineProperty的奥妙
直切主题 今天遇到一个这样的功能: 写一个函数,该函数传递两个参数,第一个参数为返回对象的总数据量,第二个参数为初始化对象的数据.如: var o = obj (4, {name: 'xu', age ...
- Object.defineproperty实现数据和视图的联动
Object.defineproperty语法 var o = {}; // 创建一个新对象 // Example of an object property added with definePro ...
- Vue 双向数据绑定原理分析 以及 Object.defineproperty语法
第三方精简版实现 https://github.com/luobotang/simply-vue Object.defineProperty 学习,打开控制台分别输入以下内容调试结果 userInfo ...
- Javascript中对象的Obeject.defineProperty()方法-------------(ES5/个人理解)
在讲到Obeject.defineProperty()方法之前先得说明一下ECMAScript中有两种属性:数据属性和访问器属性. 两种属性存在的意义:描述对象属性(key)的一些特性,因为这些属性是 ...
- Object.defineProperty vs __defineGetter__ vs normal
Testing in Chrome 31.0.1650.63 32-bit on Windows Server 2008 R2 / 7 64-bit Test Ops/sec Object.defin ...
- Object.defineProperty
属性类型ECMA-262第5版在定义只有内部才用的特性(attribute)时,描述了属性(property)的各种特征.ECMA-262定义这些特性是为了实现JavaScript引擎用的,因此在Ja ...
- Object.defineproperty实现数据和视图的联动 ------是不是就是 Angular 模型和视图的同步的实现方式???
参考:http://www.cnblogs.com/oceanxing/p/3938443.html https://developer.mozilla.org/zh-CN/docs/Web/Java ...
- 20+行代码使用es5 Object.defineProperty 实现简单的watch功能
/** * 一个简单的demo 帮助理解defineProperty,只对Object类型参数有效 */ $watch=function(myObject,callback){ function in ...
- javascript面向对象属性函数用法(defineProperty与getOwnPropertyDescriptor)
defineProperty用于设置一个对象的属性描述符,属性描述符有4个:[[Configurable]], [[Enumerable]], [[Writable]],[[Value]] 当一个属性 ...
- Object.defineProperty()方法的用法详解
Object.defineProperty()函数是给对象设置属性的. Object.defineProperty(object, propertyname, descriptor); 一共有三个参数 ...
随机推荐
- C#中实现Hash应用
在C#中,数据的Hash以MD5或SHA1的方式实现,MD5与SHA1都是Hash算法,MD5输出是128位的,SHA1输出是160位的,MD5比SHA1快,SHA1比MD5强度高. 1.1 SHA- ...
- selenium 模拟登陆豆瓣,爬取武林外传的短评
selenium 模拟登陆豆瓣,爬去武林外传的短评: 在最开始写爬虫的时候,抓取豆瓣评论,我们从F12里面是可以直接发现接口的,但是最近豆瓣更新,数据是JS异步加载的,所以没有找到合适的方法爬去,于是 ...
- 正确的安装和使用nvm(mac)<转>
前言 目前主流的node版本管理工具有两种,nvm和n.两者差异挺大的,具体分析可以参考一下淘宝FED团队的一篇文章: 管理 node 版本,选择 nvm 还是 n? 总的来说,nvm有点类似于 Py ...
- Mysql命令行添加用户
创建用户: 命令: ? 1 CREATE USER 'username'@'host' IDENTIFIED BY 'password'; 说明:username – 你将创建的用户名, host – ...
- 两种Tensorflow模型保存的方法
在Tensorflow中,有两种保存模型的方法:一种是Checkpoint,另一种是Protobuf,也就是PB格式: 一. Checkpoint方法: 1.保存时使用方法: tf.train.Sav ...
- busybox介绍
BusyBox 是一个集成了一百多个最常用linux命令和工具的软件.BusyBox 将许多具有共性的小版本的UNIX工具结合到一个单一的可执行文件.这样的集合可以替代大部分常用工具比如的GNU fi ...
- Systemctl和service、chkconfig命令的关系
systemctl命令:是一个systemd工具,主要负责控制systemd系统和服务管理器. service命令:可以启动.停止.重新启动和关闭系统服务,还可以显示所有系统服务的当前状态. ch ...
- Mac下安装配置NMP环境
第一次在Mac上安装NMP,记录下 因为下面环境的安装都是基于homebrew的,所以如果没有安装他的话,要先安装他(官网:https://brew.sh/index_zh-cn.html) 安装ho ...
- [HDU 3521] [最小割] Being a Hero
题意: 在一个有向图中,有n个点,m条边$n \le 1000 \And \And m \le 100000$ 每条边有一个破坏的花费,有些点可以被选择并获得对应的金币. 假设一个可以选的点是$x$ ...
- 第09课:【实战】Redis网络通信模块源码分析(2)
侦听 fd 与客户端 fd 是如何挂载到 EPFD 上去的 同样的方式,要把一个 fd 挂载到 EPFD 上去,需要调用系统 API epoll_ctl ,搜索一下这个函数名.在文件 ae_epoll ...