属性getter和setter

我们知道,对象属性是由名字、值和一组特性(attribute)构成的。在ECMAScript5 中,属性值可以用一个或两个方法替代,这两个方法就是getter和setter。由getter和setter定义的属性称做“存取器属性”(accessor property),它不同于“数据属性”(data property),数据属性只有一个简单的值。

程序查询存取器属性的值时,JavaScript调用getter方法(无参数)。这个方法的返回值就是属性存取表达式的值。当程序设置一个存取器属性的值时,JavaScript调用setter方法,将赋值表达式右侧的值当做参数传入setter。从某种意义上讲,这个方法负责“设置”属性值。可以忽略setter方法的返回值。

和数据属性不同,存取器属性不具有可写性(writable attribute)。如果属性同时具有getter和setter方法,那么它是一个读/写属性。如果它只有getter方法,那么它是一个只读属性。如果它只有setter方法,那么它是一个只写属性(数据属性中有一些例外),读取只写属性总是返回undefined。

定义存取器属性最简单的方法是使用对象直接量语法的一种扩展写法:

var o={//普通的数据属性
    data_prop:value,//存取器属性都是成对定义的函数
    get accessor_prop(){/*这里是函数体*/},
    set accessor_prop(value){/*这里是函数体*/}
};

存取器属性定义为一个或两个和属性同名的函数,这个函数定义没有使用function关键字,而是使用get和(或)set。注意,这里没有使用冒号将属性名和函数体分隔开,但在函数体的结束和下一个方法或数据属性之间有逗号分隔。

要想设置属性的特性,或者想让新建属性具有某种特性,则需要调用Object.definePeoperty(),传入要修改的对象、要创建或修改的属性的名称以及属性描述符对象。

时间: 2024-11-14 11:38:44

属性getter和setter的相关文章

《JS权威指南学习总结--6.6属性getter和setter》

内容要点: 一.对象属性 对象属性是由名字.值和一组特性构成的.在ES5中,属性值可以用一个或两个方法替代,这两个方法就是getter和setter.由getter和setter定义的属性称做 "存储器属性",它不同于 "数据属性",数据属性就是一个简单的值. 当程序查询存取器属性的值时,JS调用getter方法(无参数).这个方法的返回值就是属性存取表达式的值. 当程序设置一个存取器属性的值时,JS调用setter方法,将赋值表达式右侧的值当做参数传入setter

vue_计算属性getter和setter方法

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> </head> <bod

JavaScript中闭包实现的私有属性的getter()和setter()方法

注意: 以下的输出都在浏览器的控制台中 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>闭包</title> </head> <body> <script type="text/javascript"> /** * 利用闭包实现 * 这个函数给对象o增加了属性存储器方法 * 方法名称为ge

ECMAScript5中的对象存取器属性:getter和setter

显然这是一个无关IE(高级IE除外)的话题,尽管如此,有兴趣的同学还是一起来认识一下ECMAScript5标准中getter和setter的实现.在一个对象中,操作其中的属性或方法,通常运用最多的就是读(引用)和写了,譬如说o.get,这就是一个读的操作,而o.set = 1则是一个写的操作.事实上在除ie外最新主流浏览器的实现中,任何一个对象的键值都可以被getter和setter方法所取代,这被称之为“存取器属性”. 毫无疑问,getter负责查询值,它不带任何参数,setter则负责设置键

js中的访问器属性中的getter和setter函数实现数据双向绑定

嗯,之前在读js红宝书的时候,在对象那一章有介绍属性类型.第一种数据类型指的是数据属性,第二种是访问器属性.在初识vue的时候,其双向数据绑定也是基于访问器属性中的getter和setter函数原理来实现的.本篇文章就着重解析这两个函数的工作原理. 首先,我们先创建一个a对象,并给他定义了一个默认的属性_b,_b前面的下划线是一种常用的记号,用于表示只能通过对象方法访问的属性. var a={ _b=5;}; 接着定义一个属性为'c'的访问器属性,该属性包含一个get和set函数,get函数用来

自定义类属性设置及setter、getter方法的内部实现

属性是可以说是面向对象语言中封装的一个体现,在自定义类中设置属性就相当于定义了一个私有变量.设置器(setter方法)以及访问器(getter方法),其中无论是变量的定义,方法的声明和实现都是系统自动生成的并且经过了相应地内存管理和优化,无需开发者操心. 属性的声明: 属性一般定义在类的接口,或类的延展内,并且放在方法的声明之前,成员变量的声明之后.属性关键字是@property,括号内的是属性的属性,然后是变量的类型和名字,属性的定义一般分为两种情况,一种是非对象类型的变量,如int整型,使用

计算属性的getter和setter

setter:设置值时触发, getter:获取值时触发, vue中computed属性默认为getter,但是它还提供了setter,可以由因变量去影响自变量. 1 computed: { 2 fullName: { 3 // getter 4 get: function () { 5 return this.firstName + ' ' + this.lastName 6 }, 7 // setter 8 set: function (newValue) { 9 var names = n

Vue引发的getter和setter

Vue引发的getter和setter 公司的新项目决定使用Vue.js来做,当我打印出Vue实例下的data对象里的属性时,发现了一个有趣的事情: 它的每个属性都有两个相对应的get和set方法,我觉的这是多此一举的,于是去网上查了查Vue双向绑定的实现原理,才发现它和Angular.js双向绑定的实现原理完全不同,Angular是用的数据脏检测,当Model发生变化,会检测所有视图是否绑定了相关数据,再更改视图.而Vue使用的发布订阅模式,是点对点的绑定数据. Vue的数据绑定只有两个步骤,

为什么要设置getter和setter?

面向对象语言中,通常把属性设置为私有,然后添加getter和setter方法来访问.有人说,这本质上和设置属性为公有没有区别,干脆把属性public算了.也有人反驳,这样做破坏了封装.但是,破坏了封装有何坏处? 今天在读一篇斯坦福大学C++课程讲义时,看到了关于这个问题的说法: 类牵涉到2个角色:实现者和客户端.实现者负责实现,并提供接口:客户端负责调用接口,不关心实现.如果属性变公有,暴露给了客户端,客户端调用了公有属性.假如实现者修改了类的内部实现,比如把某个公有属性给删了或者改了名(这对实