首页
学习
活动
专区
圈层
工具
发布

盘点JavaScript中getter()和setter()函数的使用

它们本质上是用于获取和设置值的函数,但从外部代码来看就像常规属性。 二、Getter 和 setter 访问器属性由 “getter” 和 “setter” 方法表示。...四、更聪明的 getter/setter Getter/setter 可以用作“真实”属性值的包装器,以便对它们进行更多的控制。...例: 如果想禁止太短的 user的 name,可以创建一个 setter name,并将值存储在一个单独的属性 _name中: let user = { get name() { return...五、兼容性 访问器的一大用途是,它们允许随时通过使用 getter 和 setter 替换“正常的”数据属性,来控制和调整这些属性的行为。...六、总结 本文基于JavaScript基础,介绍了getter 和 setter函数的使用。对于其中的属性,通过案例的样式,运行效果图的展示,进行详细的讲解。

2.1K11

JavaScript之对象(一)

let person = { name: 'clz' } 设置成不可修改、不可定义的时候,修改、删除属性都不会报错,不过也不会成功,会被忽略,相当于什么都没干 Object.defineProperty...Enumerable]] [[Get]]: 获取函数,在读取属性时调用,默认值为 undefined [[Set]]: 设置函数,在写入函数是调用,默认值是undefined 访问器属性和数据属性中不重合的特性不能同时使用...,比如,如果使用setter和getter,那再使用writable或value就会报错。...至于为什么会报错,就是因为会有冲突,比如既设置了value和getter,那么这个时候应该怎么获取数据呢?所以多一事不如少一事,数据属性和访问器属性不重合的特性不能同时使用。...定义多个属性 使用Object.defineProperty只能定义一个属性的特殊属性。我们可以通过Object.defineProperties定义多个属性。

20310
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    浅谈JavaScript 数据属性和访问器属性

    数据属性一般用于存储数据数值,而访问器属性一般进行get/set操作,不能直接存储数据数值。在ES5中,我们为了描述属性(property)的各种特征,定义了特性(attribute)。...configurable设置为false之后,就表示不能从对象中删除属性。...它包含一对getter和setter函数。当读取访问器属性时,会调用getter函数并返回有效值;当写入访问器属性时,会调用setter函数并传入新值,setter函数负责处理数据。...和setter函数,(不过这两个函数都不是必须的),默认都是undefined.一般情况不用去定义setter和getter方法.找了很久也不知道在哪种场景适合用。...存储器属性与数据属性最大的不同就是增加了getter/setter,通过它们可以对属性的值进行操作,可以实现一些实用的功能。 ?

    1.6K40

    JavaScript数据属性和访问器属性

    访问器属性 访问器属性不包含数据值(没有 [[Value]] 特性),它们包含一对 getter 和 setter 函数(这两个函数都不是必须的)。...这是使用访问器属性的常见方式,即设置一个属性的值会导致其他属性发生变化。 不一定非要同时指定 getter 和 setter。只指定 getter 意味着属性是不能写,尝试写入属性会被忽略。...在严格模式下,尝试写入只指定了 getter 函数的属性会抛出错误。类似地,只指定 setter 函数的属性也不能读,否则在非严格模式下返回 undefined,严格模式下报错。...[[Configurable]] 把 configurable 设置为 false,表示不能从对象中删除属性,如果对这个属性调用 delete,则在非严格模式下什么都不会发生,严格模式下报错。...其他 我们可以用 Object.defineProperties() 方法同时定义多个属性。

    1.9K31

    深入 JS 对象属性

    处理设置的函数称为setter: var obj = { get prop () { return 'Getter'; }, set prop (value) { console.log...('Setter: ' + value); } } 访问 obj 属性: > obj.prop 'Getter' > obj.prop = 123; Setter: 123 1.3 内部属性...以下特性是属于访问器属性: [[Get]]:是一个函数,表示该属性的取值函数(getter),默认为undefined [[Set]]:是一个函数,表示该属性的存值函数(setter),默认为undefined...obj: 将要被添加属性或修改属性的对象 props: 该对象的一个或多个键值对定义了将要为对象添加或修改的属性的具体配置 var obj = Object.defineProperties({}, {...enumerable: false, configurable: false } > Object.getOwnPropertyDescriptor(obj, "toString") undefined 创建,删除和定义属性仅影响原型链中的第一个对象

    10K50

    使用 Object.defineProperty 为对象定义属性

    Vue使用的是 ES5 提供的 Object.defineProperty() 结合发布者-订阅者模式,通过Object.defineProperty() 来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者...那我们直接使用「对象.属性」就好了,为什么要用 Object.defineProperty 这么复杂的方法呢?...Object.defineProperty 解决什么问题 如果你想定义一个对象的属性为只读怎么办? 「对象.属性」能做到吗?显然不能!Object.defineProperty 却可以做到。...一个给属性提供 getter 的方法。该方法返回值被用作属性值。 set: 默认为 undefined。一个给属性提供 setter 的方法。该方法将接受唯一参数,并将该参数的新值分配给该属性。...Object.freeze(obj) Object.freeze() 方法可以冻结一个对象,冻结指的是不能向这个对象添加新的属性,不能修改其已有属性的值,不能删除已有属性,以及不能修改该对象已有属性的可枚举性

    1.2K10

    全面梳理JS对象的访问控制及代理反射

    JS对象的访问控制 [1.1] 熟悉的 getter/setter 所谓 getter/setter,其定义一般为: 一个 getter 方法不接受任何参数,且总是返回一个值 一个 setter 总是接受一个参数...,且并不会返回值 一些 getter/setter 的常识: 也被称为存取方法,是访问方法(access methods)中最常用的两个 用来封装私有成员方法,以隔离外界对其的直接访问 也可以在存取过程中添加其他的逻辑...在同一个对象中,不能为一个已有真实值的变量使用 set ,也不能为一个属性设置多个 set ?..._attr) //'new' 而 handler 也是一个对象,其若干规定好的属性是定义好一个个函数,表示了当执行目标对象的对应访问时所执行的操作;最常见的操作是定义 getter/setter 的 get...删除 使用 使用 Object.defineProperty() 也可以设置 getter/setter 等 历史上利用 Object.prototype.

    2.4K30

    JavaScript之面向对象的概念,对象属性和对象属性的特性简介

    ECMA-262定义这些特性是为了实现JavaScript引擎用的,因此在JavaScript中不能直接访问他们,为了表示特性是内部值,ECMA-262规范把它们放在了两对方括号中,例如[[Enumerable...]]特性都被设置为true,而[[Value]]被设置为指定的值"张三";按照上面特性的描述,person对象中的name属性可以通过delete删除重新定义该属性,可以修改该属性的特性,可以把该属性修改为访问器属性...,且类似与面向对象里面的类属性,他们都包含一对getter和setter函数,在读取访问器属性时,会调用getter函数,这个函数会返回有效的值,在写入访问器属性时,会调用setter函数并写入新值,这个函数负责决定如何处理数据..._year前面的下划线十一找那个常用的标记,用于表示只能通过通过对象方法访问的属性。而访问器属性year则包含一个getter函数和setter函数。...getter函数返回_year值.这里不一定要同时指定getter和setter。只指定getter意味着属性是不能写,只指定setter意味着只写,无法获取属性值。

    3.2K60

    JS面向对象

    [[Configurable]] 和数据属性的[[Configurable]]一样,表示能否通过delete删除此属性,能否修改属性的特性,或能否修改把属性修改为访问器属性,如果直接使用字面量定义对象...,默认值为true [[Get]] 一个给属性提供 getter 的方法(访问对象属性时调用的函数,返回值就是当前属性的值),如果没有 getter 则为 undefined。...默认为 undefined [[Set]] 一个给属性提供 setter 的方法(给对象属性设置值时调用的函数),如果没有 setter 则为 undefined。...语法: Object.defineProperties(obj, props) obj: 将要被添加属性或修改属性的对象 props: 该对象的一个或多个键值对定义了将要为对象添加或修改的属性的具体配置...2,额外说一句,vue中的计算属性就是利用setter来实现的 注意: 1.getter和setter可以不同时使用,但在严格模式下只其中一个,会抛出错误 2.数据描述符与存取描述符不可混用,会抛出错误

    8.8K20

    了解JavaScript对象的特殊属性

    ,通过字面量定义不是 四个值 [[Configurable]]:能否用 delete 删除某个属性,是否可以修改属性的特性,能否改为访问器属性,字面量创建的对象默认值为 true [[Enumerable...() 但一个属性添加了 get 和 set 方法后,该属性就是一个访问器属性,读取时触发 get ,设置值时触发 set set 指向了 setter方法,get 指向了 getter 方法 约定属性名前面加上...,表示不能重新定义特殊属性 获取对象属性的特殊属性值 Object.getOwnPropertyDescriptor() 接受两个参数,参数1位对象,参数2为属性值。...Cannot both specify accessors and a value or writable attribute, 这样一看就明白了,数据属性是定义某个属性的读取写入功能的,而访问器属性则是用来间接读取写入对象中的属性...所以这很像 公有变量与私有变量,如果要在对象中定义对外开放的变量,此时可以用数据属性来规定它,如果你想定义一个不对外公开的变量,就用访问器属性规定它

    87610

    linux中还有root不能删除的文件?

    Linux和类Unix操作系统默认都有root账号,默认情况下root可以修改系统上所有目录和文件的帐户或用户名。在本文将展示如何使Linux中的root用户也无法删除目录或文件。...要使文件不可被任何系统用户(包括 root 用户)删除,需要使用chattr命令使其不可修改。此命令更改Linux文件系统上的文件属性。...如何在Linux中使文件不可删除 下面的命令使/rumenz/passwd文件不可变(或不可删除)。这意味着不能以任何方式修改文件:不能删除或重命名。...要查看文件的属性使用lsattr command > lsattr /rumenz/passwd ----i--------e-- passwd 现在尝试以普通用户和root用户身份删除不可变文件...y rm: cannot remove ‘passwd’: Operation not permitted 如何在Linux中使目录和下面的所有子目录都不能被删除 使用-R参数,你可以递归地更改目录的属性及其内容

    3.6K10

    《javascript高级程序设计》笔记:对象数据属性和访问器属性

    默认为false 设置为true可以被删除或可以重新设置特性; 设置为false,不能被可以被删除或不可以重新设置特性,只能将writable从true置为false 一旦把属性定义为不可配置的,就不能再把它便会可配置的...不一定非要同时指定getter和setter。...只指定getter意味着属性是不能写,尝试写入属性会被忽略。在严格模式下,尝试写入只指定getter函数的属性会抛出错误。...类似的,只指定setter函数的属性也不能读,否则在非严格模式下会返回undefined,而在严格模式下会抛出错误。...定义多个属性 Object.defineProperties() 方法直接在一个对象上定义新的属性或修改现有属性,并返回该对象 语法:Object.defineProperties(obj, props

    1.2K20

    达观数据前端分享:理解 JavaScript 中的对象的属性

    把[[configurable]]设置为false,表示不能从对象中删除该属性。如果对这个属性调用delete,在非严格模式下该属性的删除操作不会生效,在严格模式下会导致抛出错误。...在读取访问器属性时,会调用getter()函数,这个函数负责返回有效的值;在写入访问器属性时,会调用setter()函数并传入新值,这个函数负责如何处理数据。...以上代码创建了一个book 对象,并给它定义两个默认的属性:_year 和edition。year 的访问器属性包含getter()函数和setter()函数。...getter()函数返回_year 的值,setter()函数通过计算得出_year 和edition 的值。这是访问器属性的常见用法,即设置一个属性的值会导致其他属性发生变化。...(达观数据http://www.datagrand.com 赵业辉) 2定义多个属性 使用Object.defineProperties()定义多个属性。

    2.1K90

    【深入vue】为什么Vue3.0不再使用defineProperty实现数据监听?(修订版)

    push 并未触发 setter 和 getter 方法,数组的下标可以看做是对象中的 key ,这里push 之后相当于增加了下索引为3的元素,但是并未对新的下标进行 observe ,所以不会触发。...数组的 pop 方法 ? 当移除的元素为引用为2的元素时,会触发 getter 。 ? 删除了索引为2的元素后,再去修改或获取它的值时,不会再触发 setter 和 getter 。...通过 pop 或 shift 删除元素,会删除并更新索引,也会触发 setter 和 getter 方法。...hasProto 定义如下。 ? arrayMethods 是对数组的方法进行重写,定义在 core/observer/array.js 中, 下面是这部分源码的分析。...Object.defineProperty 对数组和对象的表现一直,并非不能监控数组下标的变化,vue2.x中无法通过数组索引来实现响应式数据的自动更新是vue本身的设计导致的,不是 defineProperty

    2.5K40

    ES5详解_es6配置表

    ---- 必须用var声明变量 禁止自定义的函数中的this指向window 创建eval作用域 对象不能有重名的属性 2 JSON ---- ES5提供了JSON全局对象,用来序列化和反序列化对象为JSON...*/ delete createPerson.gender console.log(createPerson) 输出 我们发现新建的对象的原形为person,并将属性继承了下来 我们和无法去删除定义的属性...3.2 Object.defineProperties ---- 用来监听对象属性,可直接在一个对象上定义一个或者多个新的属性可修改属性一共两个参数 第一个参数:必须, 对其添加或修改属性的对象 第二个参数...:配置对象,包括 数据(数据描述符)属性 属性的配置与Object.create相同 访问器(存取描述符)属性,我们主要使用它的getter、setter get:用来获取当前属性值得回调函数 set...console.log(person.firstName)// BaJie 输出 3.3 对象本身的方法 ---- 是队形本身具有的getter和setter,功能与Object.defineProperties

    35520

    浅谈JavaScript的面向对象程序设计(一)

    面向对象的语言有一个标志,他们都有类的概念,通过类可以创建多个具有相同属性和方法的对象。但是JavaScript中没有类的概念,因此JavaScript与其他的面向对象语言还是有一定区别的。...这个方法接收三个参数:属性所在的对象、属性的名字和描述符。描述符对象的属性必须是configurable、enumerable、writable和value中的一个或者多个。...把configurable设置为false之后,该属性就将无法通过delete删除,同时也不能通过Object.defineProperty()方法设置除writable之后的值。...访问器属性 访问器属性不包含value,但是包含一对getter和setter函数。在读取访问器属性时,会调用getter函数。在写入访问器属性时,会调用setter函数。...该方法的第一个参数是对象,第二个参数是由需要定义的属性组成的对象。

    77670
    领券