JavaScript对象中属性的getter和setter方法
2017-01-10 11:54
671 查看
JavaScript对象的属性是由名字、值和一组特性(可写、可枚举、可配置等)构成的。在ECMAScript 5中,属性值可以用一个或两个方法代替,这两个方法就是getter和setter。
上面的代码中,属性a称为“数据属性”,它只有一个简单的值;像属性b这种用getter和setter方法定义的属性称为“存取器属性”。
存取器属性定义为一个或两个与属性同名的函数,这个函数定义没有使用function关键字,而是使用get或set,也没有使用冒号将属性名和函数体分开,但函数体的结束和下一个方法之间有逗号隔开。
当程序查询存取器的属性值时,JavaScript代用getter方法(无参数),这个方法的返回值就是该属性存取表达式的值。当程序设置一个存取器属性值时,JavaScript调用setter方法,将赋值表达式右侧的值当作参数传入setter。从某种意义上来说,这个方法负责设置属性值,可以忽略该方法的返回值。
当一个属性被定义为存取器属性时,JavaScript会忽略它的value和writable特性,取而代之的是set和get(还有configurable和enumerable)特性。
如上面代码所示,由于我们只定义了属性a的getter,所以对a进行设置(即赋值)时set会忽略赋值操作,不会抛出错误。
正确的写法如上所示。getter和setter方法中的this都指向myObj对象。这里我们把赋值操作中的3存储到另一个中间变量
另外,存取器属性也是可以继承的:
var myObj = { a: 2, get b(){ return 3; } }; console.log(myObj.a);//2 console.log(myObj.b);//3
上面的代码中,属性a称为“数据属性”,它只有一个简单的值;像属性b这种用getter和setter方法定义的属性称为“存取器属性”。
存取器属性定义为一个或两个与属性同名的函数,这个函数定义没有使用function关键字,而是使用get或set,也没有使用冒号将属性名和函数体分开,但函数体的结束和下一个方法之间有逗号隔开。
当程序查询存取器的属性值时,JavaScript代用getter方法(无参数),这个方法的返回值就是该属性存取表达式的值。当程序设置一个存取器属性值时,JavaScript调用setter方法,将赋值表达式右侧的值当作参数传入setter。从某种意义上来说,这个方法负责设置属性值,可以忽略该方法的返回值。
当一个属性被定义为存取器属性时,JavaScript会忽略它的value和writable特性,取而代之的是set和get(还有configurable和enumerable)特性。
var myObj = { get a(){ return 2; } }; myObj.a = 3; console.log(myObj.a);//2
如上面代码所示,由于我们只定义了属性a的getter,所以对a进行设置(即赋值)时set会忽略赋值操作,不会抛出错误。
var myObj = { get a(){ return this._a_; }, set a(val){ this._a_ = val; } }; myObj.a = 3; console.log(myObj.a);//3
正确的写法如上所示。getter和setter方法中的this都指向myObj对象。这里我们把赋值操作中的3存储到另一个中间变量
_a_中。名称
_a_只是一种惯例,并没有其它任何特殊行为,它只是一个普通的属性。把它换成其它任意合法名称如
_b_都行,甚至可以在外面将它打印出来。
var myObj = { get a(){ return this._b_; }, set a(val){ this._b_ = val; } }; myObj.a = 3; console.log(myObj.a);//3 console.log(myObj._b_);//3
另外,存取器属性也是可以继承的:
var myObj = { get a(){ return this._b_; }, set a(val){ this._b_ = val; } }; myObj.a = 3; var anotherObj = Object.create(myObj); console.log(anotherObj.a);//3
相关文章推荐
- JavaScript对象中属性的getter和setter方法
- 浅谈 JS 对象添加 getter与 setter 的5种方法以及如何让对象属性不可配置或枚举
- JavaScript对象属性的getter和setter
- 给内置对象或自定义对象添加存取器属性(getter setter)的方法总结
- JavaScript对象中的属性(可写,可配置,可枚举,value,getter,setter)
- JavaScript 操作对象属性(设置属性, setter/getter, 序列化)
- javascript调试测试,利用vs2008:智能对象类型感知,方法及属性提示;立即窗口调试等
- 关于Javascript与表单结合时出现"对象不支持此属性或方法"的问题总结(不断更新中...)
- javascript中String 对象属性和方法
- JavaScript中的高级特性及特别对象、属性和方法
- javascript-window对象的方法和属性资料
- Javascript数组对象的方法和属性
- Javascript数组对象的方法和属性
- javascript中Object类原型对象的属性和方法
- 对javascript基本对象的属性以及方法的实例介绍
- JavaScript 内置对象(一):Array 对象(构造函数、属性和方法)
- Javascript 对象不支持此属性或方法,Object doesn’t support this property or method
- Javascript数组对象的方法和属性
- 对javascript基本对象的属性以及方法的实例介绍
- Javascript对象属性方法集锦