在介绍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. Seal Report_20160923

    Seal Report算是报表工具中比较好用的一个,它提供了一个完整的从其他任何数据库产生报表的架构.该产品主要关注于容易安装和报表设计,一旦安装好,报表很快就可以建立并且发布.该组件完全开源,使用C ...

  2. 洛谷 P2919 [USACO08NOV]守护农场Guarding the Farm

    题目描述 The farm has many hills upon which Farmer John would like to place guards to ensure the safety ...

  3. OGG 11g Checkpoint 详解

    OGG Checkpoint 详解   定位中断的位置,下次启动从中断的位置开始恢复.     1.target  端配置: 2.一条记录对应一个replicat   一. Extract Check ...

  4. TTY,Console以及Terminal

    TTY可以理解是一种终端显示.可以在/dev文件夹看到多个tty开头的文件,可以通过alt+Fn(n=1~6)来进行切换.这个是不是和GUI场景下的多个Terminal窗口是一致的呢? 伪TTY是指一 ...

  5. poj1179多边形——区间DP

    题目:http://poj.org/problem?id=1179 区间DP,值得注意的是有负值,而且有乘法,因此可能会影响最大值: 注意memset中写-1仅仅是-1,-2才是一个很小的负数: 最后 ...

  6. SpringMVC 全注解实现 (1) servlet3.0以上的容器支持

    一. Spring MVC入门 1.1 request的处理过程 用户每次点击浏览器界面的一个按钮,都发出一个web请求(request).一个web请求的工作就像一个快递员,负责将信息从一个地方运送 ...

  7. 第一章 Git 一览

    虽然这个系列的文章主要关注的是Github,然而首先了解下Git的基本概念和名词也是非常有帮助的. 工作目录(Working Directory) 工作目录是你个人计算机上的一个目录.在该目录下,每一 ...

  8. [poj3368]Frequent values(rmq)

    题意:给出n个数和Q个询问(l,r),对于每个询问求出(l,r)之间连续出现次数最多的次数. 解题关键:统计次数,转化为RMQ问题,运用st表求解,注意边界. 预处理复杂度:$O(n\log n)$ ...

  9. 微信小程序开发之下拉菜单

    实现功能:点击维保人员,调出下拉菜单.选择子菜单时,显示右边的图标表示选中,并进行赋值并进行搜索筛选 Wxml: <view class="dtclass" bindtap= ...

  10. java数据结构和算法08(B树的简单原理)

    这一篇首先会说说前面剩余的一点知识2-3树,然后简单说说B树,不写代码,只是简单看看原理吧! 为什么要说一下2-3树呢?了解2-3树之后能更快的了解B树: 1.简单看看2-3树 其实我们学过了前面的2 ...