在介绍js中Object.defineProperty()和defineProperties()之前,我们了解下js中对象两种属性的类型:数据属性和访问器属性。

数据属性

数据属性包含一个数据的位置,在这个位置可以读取和写入。其有4个描述其行为的特性

[[Configurable]]

表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性,能否把属性修改为访问器属性。通过对象字面量创建的属性,默认为true

[[Enumerable]]

表示能否通过for-in循环访问属性。(或通过Object.keys()获取)。默认为true

[[Writable]]

表示能否修改属性值。默认为true.

[[Value]]

包含这个属性的数据值。属性值的读写都在这个位置。默认为undefined

访问器属性

访问器属性不包含数据值,它们包含一对getter和setter函数(非必须),getter负责读取属性时调用并返回有效值;setter是写入属性时调用并负责如何处理该数据。其也有4个特性

[[Configurable]]

表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性,能否把属性修改为数据属性。默认为true

[[Enumerable]]

表示能否通过for-in循环返回属性。默认为true

[[Get]]

在读取属性时调用的函数。默认为undefined

[[Set]]

在写入属性时调用的函数。默认为undefined
访问器属性不能直接定义,必须使用Object.defineProperty();
属性的定义:在js中,给一个对象添加方法很简单,如
var obj = {};
obj.name = 'lc';
obj.weight = 180;
 
但,这里我们介绍另外一种两种方式:

Object.defineProperty()

功能:方法会在对象上定义一个新属性,或者修改一个对象的现有属性,比返回这个对象。如果不指定configurable、enumerable、writable,则默认值为false;不指定value、get、set,则默认为undefined
语法:Object.defineProperty(obj,prop,descriptor)
obj:需要修改的对象。
prop:目标对象需要定义或修改的属性名称
descriptor:将被定义或修改的属性描述符
var book = {
// _price: 20
};
//添加name属性
Object.defineProperty(book, 'name', {
value: 'bkk',
enumerable: true,
configurable: false,
writable: true
});
console.log(book.name) //bkk

  

Object.defineProperties()

功能:方法将直接在对象上定义一个或多个新的属性或修改现有属性,并返回该对象
语法:Object.defineProperties(obj,props)
obj:将要被添加属性或修改属性的对象
props:该对象的一个或多个键值对定义了将要添加或修改的属性的具体配置。
Object.defineProperties(book,{
test:{},
_year:{
value:2004,
writable: true,
enumerable:true
},edition:{
value:1,
writable: true
},year:{ //定义访问器属性
get :function(){
return this._year;
},
set: function(newValue){
if(newValue>2004){
this._year = newValue;
this.edition += newValue -2004;
}
}
}
})

Object.getOwnPropertyDescriptor()

功能:获取对象自身属性的描述符
语法:Object.getOwnPropertyDescriptor(obj,prop);
obj:需要查找的目标对象
prop:需要查找的属性名
var desc = Object.getOwnPropertyDescriptor(book,'name');
console.log(desc);
//{value: "bkk", writable: true, enumerable: true, configurable: false}

  

Object.getOwnPropertyDescriptors()

功能:获取对象自身所有属性的描述符
语法:Object.getOwnPropertyDescriptors(obj);
obj:需要查找的目标对象
var descs = Object.getOwnPropertyDescriptors(book);
console.log(descs);
{
"name":{
"value":"bkk",
"writable":true,
"enumerable":true,
"configurable":false
},
"test":{
"writable":false,
"enumerable":false,
"configurable":false
},
...
"year":{
"enumerable":false,
"configurable":false
}
}

  

回到开定用对象字面量定义的对象 obj

var descs = Object.getOwnPropertyDescriptors(obj);
console.log(JSON.stringify(descs))
{
"name":{
"value":"lc",
"writable":true,
"enumerable":true,
"configurable":true
},
"weight":{
"value":180,
"writable":true,
"enumerable":true,
"configurable":true
}
}
可以看到writable、enumerable、configurable的默认值都是true.
 
-----------------------------------------------------------------------------------------------
 
在严格模式下,删除一个configurable=false属性,或给一个writable=false的属性赋值,都会报错。
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

js中Object.defineProperty()和defineProperties()的更多相关文章

  1. js中Object.defineProperty()方法的解释

    菜菜: “老大,那个, Object.defineProperty 是什么鬼?” 假设我们有个对象 user ; 我们要给它增加一个属性 name , 我们会这么做 1 2 3 var user = ...

  2. vue2.x版本中Object.defineProperty对象属性监听和关联

    前言 在vue2.x版本官方文档中 深入响应式原理 https://cn.vuejs.org/v2/guide/reactivity.html一文的解释当中,Object.defineProperty ...

  3. js中的Object.defineProperty()和defineProperties()详解

    ECMAS-262第5版在定义只有内部采用的特性时,提供了描述了属性特征的几种属性.ECMAScript对象中目前存在的属性描述符主要有两种,数据描述符(数据属性)和存取描述符(访问器属性),数据描述 ...

  4. js中Object.defineProperties 定义一个在原对象可读可写的方法

    function A(){ this.name = 'hellow word'; } Object.defineProperties( A.prototype,{ doSomething2 : { v ...

  5. js 中object对象的操作

    n = object对象 for(var p in n){ console.log(p);// 取得是key值 console.log(n[p]);//取得是value值 } 继之前js中数组的常用方 ...

  6. js中object的申明方法

    //js中的对象申明使用new Object(); //object类型的数据类似于数组通过下表来访问其中的值 //example1 var person=new Object(); person.n ...

  7. js中[object Object]与object.prototype.toString.call()

    最近在用node读取文件中的json数据后,用JSON.parse()转成了json,然后响应数据传给前端,发现输出值object对象时显示[object object],在这里我们来看一下他的具体意 ...

  8. JS中Object的一些关于原型的方法

    1.Object.getPrototypeOf(obj) 该方法返回 obj 对象的原型对象,等同于 obj.__proto__.获取对象的原型对象推荐使用该方法而不是 obj.__proto__方法 ...

  9. vue中Object.defineProperty用法

    function def (obj, key, val, enumerable) { Object.defineProperty(obj, key, { value: val, enumerable: ...

随机推荐

  1. ACM学习历程——POJ1260 Pearls(动态规划)

    Description In Pearlania everybody is fond of pearls. One company, called The Royal Pearl, produces ...

  2. 2011年浙大:Twin Prime Conjecture

    Twin Prime Conjecture Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Ot ...

  3. c++常用函数STL

    完c++快一年了,感觉很有遗憾,因为一直没有感觉到c++的强大之处,当时最大的感觉就是这个东西的输入输出比C语言要简单好写. 后来我发现了qt,opencv,opengl,原来,c++好玩的狠. 在这 ...

  4. Key and Certificate Conversion

    Key and Certificate Conversion Private keys and certificates can be stored in a variety of formats, ...

  5. python3.5 jira网站实现用户的批量插入

    工作中,经常要给多个用户创建账号,为了减少工作量,写了个自动化脚本来帮助我批量创建用户 代码如下: """自动创建Jira的学生账号""" ...

  6. Java中的Synchronized关键字用法

    认识synchronized 对于写多线程程序的人来说,经常碰到的就是并发问题,对于容易出现并发问题的地方加上synchronized修饰符基本上就搞定 了,如果说不考虑性能问题的话,这一招绝对能应对 ...

  7. JVM内存GC的骗局

    此文已由作者尧飘海授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 概述 在日常程序开发中,很多JAVA程度员不太关心内存的使用情况.当然,如果程序员运气较好或者系统没有大规模 ...

  8. linux下安装QQ等EXE文件

    安装好linux系统后,发现linux很多自带的软件用起来很不习惯,于是去网上下载QQ等在Windows下经常使用的exe文件. 发现这些文件无法安装,在网上找了一些解决办法,须下载wine,然后才可 ...

  9. List Control控件中及时捕获checkbox被选中的消息的解决方案

    转自:http://blog.csdn.net/vycode/article/details/7345073 我的功能需求是:用户可以在List Control里添加item,当无选项被选中(即Che ...

  10. 自动化测试工具 Test Studio入门教程

    Test Studio安装 可以到下载试用版 官网 http://www.telerik.com/teststudio , 装完以后需要装silverlight 安装好了,主界面是介个样子的 Test ...