js中属性类型分为两种:数据属性和访问器属性

在js中,对象都是由名值对构成的,名:就是我们所说的属性名,值就是属性对应的值(基本值、对象、方法)。

ECMA-262第5版定义了只有内部才用的特性,描述了属性的各种特征,比如,这个属性能否被删除、能否被枚举、能否被修改、以及读取属性的值。

这些特性是为了实现JavaScript引擎用的,因此在JavaScript中不能直接访问他们。

1、先来说一下数据属性

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

Configurable:表示能否通过delete删除属性,从而重新定义属性,能否修改属性的特性,或则能否把属性修改为访问器属性。我们一般在对象上自定义的属性,它们的这个特性一般为true。

Enumberable:表示能否通过for-in循环返回属性(枚举),自定义的对象属性,默认值为true。

Writable:表示能否修改属性的值,自定义对象的属性,这个特性值默认为true。

Value:包含这个属性的数据值,读取属性值的时候从这个读,写入属性值的时候,把新值保存在这个位置。这个特性的默认值为undefined。

ECMAScript5定义了一个修改属性的这些默认特性的方法:Object.defineProperty();

这个方法接收三个参数:属性所在的对象、属性的名字(字符串形式)、一个描述符对象。其中描述符对象的属性必须是:configurable、enumberable、writable、value,设置其中的一个或多个值,可以修改对应的特性值。例如:

    var person={};
Object.defineProperty(person,"name",{
writable:false,
value:"Nicholas"
});
console.log(Object.getOwnPropertyDescriptor(person,"name"));//读取属性的特性的方法,后面会介绍
console.log(person.name);//Nicholas
person.name="Greg";
console.log(person.name);//Nicholas

上面,对name属性的两个特性writable、value进行了设置,可见,我们更改name属性的值是无效的,在严格模式下会报错;

当用Object.defineProperty()创建一个新属性时,若不指定configurable、enumberable、writable这些特性时,都是false,若果在原来设置过的基础上设置其中的一个或多个,则无此限制。

另外,当设置configurable为false后,也就是把该属性变成不可设置的,除delete不能删除该属性外,再次用Object.defineProperty()方法设置除writable特性外的其它特性时,在非严格模式时什么都不会发生,在严格模式时会报错。(同时configurable特性也设置不了true了!!!);

2、访问器属性:

访问器属性不包含数据值,他们包含一对儿getter和setter函数(不过,这两个函数都不是必须的)。在读取访问器属性时,会调用getter函数,这个函数负责返回有效的值;在写入访问器属性时,会调用setter函数并传入新值,这个函数负责决定如何处理数据。访问器属性有如下4个特性。

configurable:表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性,或则能否把属性修改为数据属性。对于直接在对象上定义的属性,这个特性的默认值为true。

enumberable:表示能否通过for-in来循环返回属性。对于直接在对象上定义的属性,这个特性的默认值为true。

get:读取属性时调用的函数。默认值为undefined

set:在写入属性时调用的函数。默认值为undefined

访问器属性不能直接定义,必须使用Object.defineProperty()来定义。请看下面的例子:

    var book={
_year:2004,
edition:1
};
//下边给book对象设置一个year(访问器属性)
Object.defineProperty(book,"year",{
get:function(){
return this._year;
},
set:function(newValue){
if(newValue>2004){
this._year=newValue;
this.edition=newValue - 2004;
}
}
});
book.year =2005;
console.log(book.edition);//1
console.log(book._year);//2005
console.log(book.year);//2005
console.log(book);//{_year: 2005, edition: 1}

可见,创建的访问器属性,用console是打印不出来的,我们常见的使用访问器属性的方式就是上述这种方式,修改访问器属性,会导致其他属性变化!!!

当然,不一定非要指定get和set,只指定get就是只能读,不能写,只指定set就是不能读。

当然也可以同时定义多个属性,用:Object.defineProperties()方法,利用这个方法可以通过描述符一次定义多个属性,这个方法接收两个参数,第一个参数是要添加和修改其属性的对象,第二个参数(对象:描述符)的属性与第一个对象中要添加或修改的属性要一一对应。如:

    var book={};
Object.defineProperties(book,{
_year:{//定义一个数据属性,其它为指定的特性值为false
writable:true,
value:2004
},
edition:{//同样是一个数据属性
writable:true,
value:1
},
year:{
get:function(){
return this._year;
},
set:function(newValue){
if(newValue>2004){
this._year=newValue;
this.edition+=newValue-2004;
}
}
}
});
book.year=2003;
console.log(book);//{_year: 2004, edition: 1}
book.year=2005;
console.log(book);//{_year: 2005, edition: 1}
// Object.getOwnPropertyDescriptor();用来读取给定属性的描述符,这个方法有两个参数,属性所在的对象和要读取其描述符的属性名,返回一个对象。
var descriptor=Object.getOwnPropertyDescriptor(book,"_year");//数据属性
var descriptor2=Object.getOwnPropertyDescriptor(book,"year");//访问器属性
console.log(descriptor);//{value: 2005, writable: true, enumerable: false, configurable: false}
console.log(descriptor2);//{get: ƒ, set: ƒ, enumerable: false, configurable: false}
Object.getOwnPropertyDescriptor();用来读取给定属性的描述符,这个方法有两个参数,属性所在的对象和要读取其描述符的属性名,返回一个对象。这个方法可以在任何浏览器使用。

js中属性类型:数据属性与访问器属性的更多相关文章

  1. ECMAScript中有两种属性:数据属性和访问器属性。

    ECMA-262定义这些特性是为了实现JavaScript引擎用的,因此在JavaScript中不能直接访问它们.为了表示特性是内部值,该规范把它们放在了两对儿方括号中,例如 [[Enumerable ...

  2. JavaScript对象的两类属性(数据属性与访问器属性)

    对JavaScript来说,属性并非只是简单的名称和值,JavaScript用一组特征(attribute)来描述属性 (property). 第一类属性数据属性具有四个特征. value:就是属性的 ...

  3. JavaScript 数据属性和访问器属性

    在JavaScript中对象被定义为"无序属性的集合,其属性可以包含基本值.对象或函数."通俗点讲,我们可以把对象理解为一组一组的名值对,其中值可以是数据或函数. 创建自定义对象通 ...

  4. javascript对象属性——数据属性和访问器属性

    ECMA-262第五版在定义时,描述了属性property的各种特征,定义这些特性是为了实现javascript引擎用的,为了表示该特性是内部值,规范把它们放在了两对儿方括号中,例如[[Enumera ...

  5. Js中的数据属性和访问器属性

    Js中的数据属性和访问器属性 在javaScript中,对象的属性分为两种类型:数据属性和访问器属性. 一.数据属性 1.数据属性:它包含的是一个数据值的位置,在这可以对数据值进行读写. 2.数据属性 ...

  6. ECMAScript 5中的数据属性和访问器属性

    简介 ECMAScript 定义的对象中有两种特殊的属性, 这两种特殊的属性在你定义对象属性时就会赋予, 我们在必要时可以改写这两种特殊的属性让其属性的访问更加的合理化, 这两种特殊的属性称呼及作用如 ...

  7. JavaScript 属性类型(数据属性和访问器属性)

    数据属性 数据属性包含一个数据值的位置.在这个位置可以读取和写入值.数据属性有 4 个描述其行为的特性. [[Configurable]]:表示能否通过 delete 删除属性从而重新定义属性,能否修 ...

  8. JavaScript中的数据属性和访问器属性

    在学习JavaScript原型(prototype)和原型链(prototype chain)知识的时候,发现数据属性和访问器属性的重要性,通过不断的查找相关知识,浅显理解如下,若有差错,希望不吝赐教 ...

  9. JS的数据属性和访问器属性

    ECMA-262第5版在定义只有内部才用的特性(attribute)时,描述了属性(property)的各种特征.ECMA-262定义这些特性是为了实现javascript引擎用的,因此在javasc ...

随机推荐

  1. 【iCore4 双核心板_FPGA】例程八:乘法器实验——乘法器使用

    实验现象: 程序运行时,绿色led闪烁(目前,具体的乘法器调用请参考iCore3乘法器例程) 核心代码: module multiplier_ctrl( input clk_25m, input rs ...

  2. Java8 中增强 Future:CompletableFuture

    增强的 Future:CompletableFuture CompletableFuture(它实现了 Future 接口) 和 Future 一样,可以作为函数调用的契约.当你向它请求获得结果,如果 ...

  3. Guava Lists.transform踩坑小记<转>

    1.问题提出 1.前段时间在项目中用到Lists.transform返回的List,在对该list修改后发现修改并没有反映在结果里,研究源码后发现问题还挺大.下面通过单步调试的结果来查看Guava L ...

  4. Java知多少(43)异常处理基础

    Java异常是一个描述在代码段中发生的异常(也就是出错)情况的对象.当异常情况发生,一个代表该异常的对象被创建并且在导致该错误的方法中被抛出(throw).该方法可以选择自己处理异常或传递该异常.两种 ...

  5. js操作DOM在父元素中的结尾添加子节点注意

    impressionHtml=`<img src=${value} alt=""/>`; document.getElementById("wrapper&q ...

  6. 20 go单元测试

    单元测试 Go本身提供了一套轻量级的测试框架.符合规则的测试代码会在运行测试时被自动识别并执行.单元测试源文件的命名规则如下: 必须是以_test.go结尾的文件,比如manager_test.go ...

  7. MapReduce处理HBase出错:XXX.jar is not a valid DFS filename

    原因:Hadoop文件系统没有检查路径时没有区分是本地windows系统还是Hadoop集群文件系统 解决:  只需将Map和Reduce的init方法最后一个参数(boolean addDepend ...

  8. Python标准输出重定向

    目录 Python标准输出重定向 声明 一. 背景知识 二. 重定向方式 2.1 控制台重定向 2.2 print >>重定向 2.3 sys.stdout重定向 2.4 上下文管理器(C ...

  9. gearman(异步计算)学习

    Gearman是什么? 它是分布式的程序调用框架,可完成跨语言的相互调 用,适合在后台运行工作任务.最初是2005年perl版本,2008年发布C/C++版本.目前大部分源码都是(Gearmand服务 ...

  10. Thrift IDL

    Thrift类型 Thrift类型系统旨在允许程序员尽可能使用本机类型,无论使用何种编程语言.此信息基于并取代Thrift白皮书中的信息.Thrift IDL为每一种目标语言提供了用于生成代码的类型描 ...