在介绍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学习历程——HDU5017 Ellipsoid(模拟退火)(2014西安网赛K题)

    ---恢复内容开始--- Description Given a 3-dimension ellipsoid(椭球面) your task is to find the minimal distanc ...

  2. 【Python】Python figure显示的两种方式

    1. 两种方式: 终端输出图像新窗口输出图像 2. 终端输出命令: %matplotlib inline 新窗口输出命令: %matplotlib qt5 注意此两个语句是命令行输入,若在spyder ...

  3. Btree算法的C语言实现

    btree.h //实现对order序(阶)的B-TREE结构基本操作的封装. //查找:search,插入:insert,删除:remove. //创建:create,销毁:destory,打印:p ...

  4. 无废话WCF系列教程 -- 李林峰

    李林峰的无废话WCF入门教程 无废话WCF入门教程一[什么是WCF] 无废话WCF入门教程二[WCF应用的通信过程] 无废话WCF入门教程三[WCF的宿主] 无废话WCF入门教程四[WCF的配置文件] ...

  5. AngularJs(Part 3)--注册服务

    有以下5中方法注册一个AngularJS可以识别的Service value和constant是两个极其简单的方法,只有少数情况下会使用. service已经开始复杂了起来.而factory是我认为既 ...

  6. 写守护进程时碰到open函数的参数,没记住

    今天写一个最简单的守护进程, 要成为一个守护进程,其实很简单了.主要步骤就4步: 1,创建进程. 2,父进程退出. 3,成为会话的头领进程. 4,将工作目录改成根目录,并把标准输入输出重定向到空设备. ...

  7. null, undefined 和布尔值

    说明:此类博客来自以下链接,对原内容做了标注重点知识,此处仅供自己学习参考! 来源:https://wangdoc.com/javascript/basic/introduction.html 1.n ...

  8. Golang : pflag 包简介

    笔者在前文中介绍了 Golang 标准库中 flag 包的用法,事实上有一个第三方的命令行参数解析包 pflag 比 flag 包使用的更为广泛.pflag 包的设计目的就是替代标准库中的 flag ...

  9. Git提交与恢复

    Git提交与恢复 提交修改 git add --all # 提交所有修改文件 git add file file # 提交部分修改文件 $ git status On branch master Yo ...

  10. js 常用排序

    1. 冒泡排序 原理:从第一个元素开始,把当前元素和下一个索引元素进行比较.如果当前元素大,那么就交换位置,重复操作直到比较到最后一个元素 function bubbleSort(arr) { if ...