在介绍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. BZOJ_3550_[ONTAK2010]Vacation&&BZOJ_1283:_序列_网络流解线性规划

    BZOJ_3550_[ONTAK2010]Vacation&&BZOJ_1283:_序列_网络流解线性规划 Description 给出一个长度为 的正整数序列Ci,求一个子序列,使得 ...

  2. 算法导论笔记——第十八章 B树

    18.1 B树的定义  18.2 B树的基本操作 与一棵二叉搜索树一样,可以在从树根到叶子这个单程向下过程中将一个新的关键字插入B树中.为了做到这一点,当沿着树向下查找新的关键字所属位置时,就分裂沿途 ...

  3. MVC 模式介绍(1)

    MVC 模式 MVC 模式代表 Model-View-Controller(模型-视图-控制器) 模式.这种模式用于应用程序的分层开发. Model(模型) - 模型代表一个存取数据的对象或 JAVA ...

  4. 自动清除firefox缓存

    1.在firefox的地址栏上输入about:config回车 2.找到browser.cache.check_doc_frequency选项,双击将3改成1保存即可.  选项每个值都是什么含义的.请 ...

  5. 远程访问Linux系统桌面

     让Windows可以远程访问Linux系统桌面 http://jingyan.baidu.com/article/d8072ac47b810eec95cefde8.html linux系统下,11款 ...

  6. 用Python分析国民生产总值

    今天学习Python的matplotlib,书上的一道例题感觉写的很好(黄红梅的Python数据分析与应用),就是 利用matplotlib的各种图来对2000-2017年季度生产总值进行分析,这道题 ...

  7. 转载-【深度学习】深入理解Batch Normalization批标准化

      全文转载于郭耀华-[深度学习]深入理解Batch Normalization批标准化:   文章链接Batch Normalization: Accelerating Deep Network T ...

  8. AGC001 E - BBQ Hard【dp+组合数学】

    首先直接按要求列出式子是\( \sum_{i=1}^{n}\sum_{j=i+1}^{n}C_{a_i+a_j+b_i+b_j}^{a_i+a_j} \) 这样显然过不了,因为ab的数据范围比较小,所 ...

  9. jsp学习与提高(二)——JSP 隐式对象、表单处理及过滤器

    1.JSP 隐式对象 JSP隐式对象是JSP容器为每个页面提供的Java对象,开发者可以直接使用它们而不用显式声明.JSP隐式对象也被称为预定义变量. JSP所支持的九大隐式对象: 对象 描述 req ...

  10. ORA-01950:表空间“USERS”中无权限

    ORA-01950:表空间“USERS”中无权限 解决方案: A)确认给用户授权了resource角色 B)取消限制 ALTER USER "HCCPMS" QUOTA UNLIM ...