首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

在javascript中设置不带setter的对象属性时会发生什么

在JavaScript中,当设置不带setter的对象属性时,该属性将被视为只读属性,即无法通过赋值来修改该属性的值。如果尝试修改该属性的值,JavaScript引擎将忽略该操作或抛出错误,具体取决于是否启用了严格模式。

不带setter的对象属性通常用于表示只读的或者是计算得出的属性值。这种属性的值可以在对象创建时通过构造函数或者直接赋值进行初始化,但之后无法通过赋值来修改。

以下是一个示例:

代码语言:javascript
复制
// 定义一个对象
const person = {
  firstName: 'John',
  lastName: 'Doe',
  
  // 定义一个只读属性
  get fullName() {
    return this.firstName + ' ' + this.lastName;
  }
};

console.log(person.fullName); // 输出: John Doe

// 尝试修改只读属性的值
person.fullName = 'Jane Smith'; // 无效操作,不会修改属性的值

console.log(person.fullName); // 输出: John Doe

在上述示例中,fullName属性被定义为一个只读属性,它的值是通过firstNamelastName属性计算得出的。尝试通过赋值来修改fullName属性的值是无效的,因为它没有setter方法。

对于不带setter的对象属性,优势在于可以确保属性的值不会被意外修改,从而提高代码的可靠性和安全性。这种属性常用于表示对象的状态或者是根据其他属性计算得出的派生属性。

在实际应用中,不带setter的对象属性可以用于各种场景,例如表示用户信息、配置项、只读的计算结果等。对于腾讯云相关产品和产品介绍链接地址,由于不能提及具体品牌商,建议参考腾讯云官方文档或者咨询腾讯云的技术支持团队获取相关信息。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

JavaScript 对象是拥有属性和方法数据

JavaScript 所有事物都是对象:字符串、数字、数组、日期,等等。 JavaScript 对象是拥有属性和方法数据。...字符串对象: var txt = "Hello"; 属性: txt.length=5 方法: txt.indexOf() txt.replace() txt.search() 面向对象语言中,使用...JavaScript 函数内部声明变量(使用 var)是局部变量,所以只能在函数内部访问它。...全局变量:函数外声明变量是全局变量,网页上所有脚本和函数都能访问它。全局变量会在页面关闭后被删除。...向未声明 JavaScript 变量来分配值:如果把值赋给尚未声明变量,该变量将被自动作为全局变量声明,即使它在函数内执行。

3.7K10

那些Vue开发遇到坑---响应式系统

Vue响应式指的是你一个页面展示了一个变量值,当这个变量值由于一些操作发生改变时,Vue会自动无需刷新界面的前提下帮你把新值展示到相应位置,当然这个过程不需要你自己写任何dom刷新渲染代码...今天我就为大家分析一下,利用Vue进行开发时候,为什么有些数据变化不会被及时监听到并触发相关组件从新渲染。 对象类型JavaScript是一个引用类型,与基本类型不同,对象是按照引用访问。...,意图是想要在点击按钮时,为message对象设置contact属性值为‘clicked’。...然后作为一个程序员,你可能就要开始打debugger一步一步调试,然后你会发现,你代码并没有写错,调试器,message属性确实改变了,并且按照预期被设置为‘clicked’,但是,为什么页面毫无反应...} } } } 值得提醒是,数组类型JavaScript也是一个比较特殊数据类型,与对象类型相似,数组也是引用类型,因此开发也会遇到和对象类型相似的问题

1K50

这也许是你会遇到Google Chrome Bug

文章重点内容主要阐述 JavaScript Getter/Setter 属性访问/操作符”屏蔽“作用。 我会花稍多篇幅来描述它展现和效果,但是请你相信我。...Getter/Setter JavaScript 定义对象时,我们同时可以通过 [[Getter]]、[[Setter]] 来为属性绑定对应执行函数。...第一种即为我们熟知,如果属性 name 同时出现在了实例上以及原型 prototype 的话,那么此时首先就会发生所谓屏蔽。...如果 child 原型链上存在一个 name 并且此时他是一个 setter 时,那么此时我们实例上进行赋值操作时,原型上同名 setter 会被调用,并且 name 属性并不会被添加到实例,同时也不会对原型上...其实至此,我想和大家阐述重点就已经完成了。所谓 Getter/Setter 某些情况下会发生属性屏蔽,至于是什么情况下看到这里相信大家都已经了解非常清楚了。

33510

理论+实践:从原型链到继承模式,掌握 Object 精髓(二)

之前文章我们说过,当视图引用对象属性时会触发 [[Get]] 操作,比如 myObject.a。对于默认 [[Get]] 操作来说,第一步是检查对象本身是否有这个属性,如果有的话就使用它。...属性设置和屏蔽 • 之前说过,给一个对象设置属性不仅仅是添加一个新属性或修改已有的属性值那么简单,下面来聊一下完整这个过程。...当访问对象不存在一个属性时,[[Get]] 操作就会查找对象内部 [[Prototype]] 关联对象,这个关联关系就是一条 "原型链"(有点像嵌套作用域),找到属性时会对它进行遍历。...如果对象属性不直接存在于当前对象而是存在于原型链上层时会出现三种情况: 1....总之,不会发生屏蔽。 3. 如果在 [[Prototype]] 原型链上层存在对象属性并且它是一个 setter,那就一定会调用这个 setter

6010

计算属性是如何被Vue实现

其次,Computed 相关原理需要一些 Effect 相关原理。如果你不是很清楚 Effect 是什么,推荐你优先阅读我这篇 Vue3响应式是如何被JavaScript实现。...了解了这些基础特点后,我们控制台来打印一下 computed 来看看它是什么东西: // ......Effect 我已经在前置文章 Vue3响应式是如何被JavaScript实现 中介绍过它实现,有兴趣深入了解同学可以移步查阅。 同理,当我们首次访问该计算属性时。...之后,每当 computed 依赖响应式数据发生变化时。我们之前提过到每当 computed 依赖数据发生变化时会执行自身 Effect scheduler: // ......这样,也就达到了我们刚才需求:当 computed 依赖数据发生改变时会触发自身 Effect 执行,自身 Effect 处理函数同时会通知依赖于当前 computed Effect

78930

《你不知道JavaScript》:原型链访问

本篇开始看下js对象原型[[Prototype]]。 js对象有一种特殊内置属性 [[Prototype]],其实就是对于其他对象引用。...几乎所有的对象创建时都 [[Prototype]]属性都会被赋予一个非空值。...当试图引用对象属性时会触发[[Get]]操作,例如obj.a和newObj.a。对于默认[[Get]]操作来说,第一步是检查对象本身是否有这个属性,如果有的话就使用它。...通常为对象属性设置值我们采用=赋值操作符来进行,当为对象objfoo属性设置值时: 1obj.foo = "bar"; 如果obj对象包含名为foo普通数据访问属性,这条赋值语句只会修改已有的属性值...如果属性名foo既出现在obj对象上也出现在上层原型对象上,那就会发生屏蔽,obj对象包含foo属性会屏蔽原型链上层所有foo属性,因为obj.foo总是会选择原型链中最底层foo属性

55720

《你不知道JavaScript》-- 对象(笔记)

不同对象底层都表示为二进制,JavaScript中二进制前三位都为0的话会被判断为object类型,null二进制表示全是0,自然前三位也是0,所以执行typeof时会返回“object”。...无论返回值是什么类型,每次访问对象属性就是属性访问,如果属性访问返回是一个函数,那它也并不是一个“方法”。属性访问返回函数和其他函数没有任何区别(除了可能发生隐式绑定this)。...如果是,非严格模式下静默失败,严格模式下抛出TypeError异常; 3)如果都不是,将该值设置属性值。 如果对象不存在这个属性,[[Put]]操作会更复杂。...1.3.9 Getter 和 Setter 对象默认 [[Put]] 和 [[Get]]操作分别可以控制属性设置和获取。...ES5可以使用getter和setter部分改写默认操作,但是只能应用在单个属性上,无法应用在整个对象上。

62120

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

Javascript ,读取、赋值、调用方法等等,几乎一切操作都是围绕“对象”展开;长久以来,如何更好了解和控制这些操作,就成了该语言发展重要问题。 I....同一个对象,不能为一个已有真实值变量使用 set ,也不能为一个属性设置多个 set ?...JS代理和反射 在对象本身上,一个个属性定义访问控制,有时会带来代码臃肿,甚至难以维护;了解代理和反射概念和用法,可以有效改善这些状况。...[2.1] 传统代理模式 经典设计模式(Design Pattern),代理模式(Proxy Pattern)被广泛应用;其定义为: 代理模式,一个代理对象(Proxy)充当着另一个目标对象... JAVA/AS3 等语言中,反射一般被用于在运行时获取某个对象类名、属性列表,然后再动态构造等;比如通过 XML 配置文件值动态创建对象,或者根据名称提取 swf 文件 MovieClip

2.2K30

《你不知道js(上卷)》笔记2(this和对象原型)

如果你把null或者undefined作为this绑定对象传入call、apply或者 bind,这些值调用时会被忽略,实际应用是默认绑定规则。...new绑定 JavaScriptnew机制实 际上和面向类语言完全不同。 JavaScript,构造函数只是一些 使用new操作符时被调用函数。它们并不会属于某个类,也不会实例化一个类。...function foo(p1,p2) { this.val = p1 + p2; } // 之所以使用 null 是因为本例我们并不关心硬绑定 this 是什么 // 反正使用 new 时...原型 JavaScript对象有一个特殊 [[Prototype]] 内置属性,其实就是对于其他对象引用。几乎所有的对象创建时 [[Prototype]] 属性都会被赋予一个非空值。...JavaScript对于“构造函数”最准确解释是,所有带new函数调用。

67310

2021Vue.js面试题汇总及答案【全网最全 建议收藏】「建议收藏」

1.5.Vue.js 3.0 放弃defineProperty, 使用Proxy原因 1.6.Vue 2 给 data 对象属性添加一个新属性时会发生什么?如何解决?...用来依赖收集,setter 用来派发更新),并且在内部追踪依赖,属性被访问和修改时通知变化。...和 setter 基本不会再有针对性优化 1.6.Vue 2 给 data 对象属性添加一个新属性时会发生什么?...="message" @input=" 1.15.data为什么是一个函数而不是对象 JavaScript对象是引用类型数据,当多个实例引用同一个对象时,只要一个实例对这个对象进行操作,其他实例数据也会发生变化...换句话说,只要观察到数据变化,就会自动开启一个队列,并缓冲在同一个事件循环中发生所以数据改变。缓冲时会去除重复数据,从而避免不必要计算和 DOM 操作。

8.6K30

《你不知道JavaScript(上)之原型对象》读书笔记

属性数据描述符writable是否是false?如果是,非严格模式下静默失败,严格模式下抛出 TypeError 异常。如果都不是,将该值设置属性值。5....【Getter】& 【Setter对象默认 [[Put]] 和 [[Get]] 操作分别可以控制属性设置和获取。... ES5 可以使用 getter 和 setter 部分改写默认操作,但是只能应用在单个属性上,无法 应用在整个对象上。getter 是一个隐藏函数,会在获取属性值时调用。...总之,不会发生屏蔽。如果在[[Prototype]]链上层存在foo并且它是一个setter(参见第3章),那就一定会 调用这个 setter。...这个关联关系实际上定义了一条“原型链”(有点像嵌套作用域链),查找属性时会对它进行遍历。

61530

VueJS 基础知识

computed:根据已经存在属性计算出新属性,对于相同数据会缓存,当依赖属性发生变化时,这个属性值也会自动更新。 watch:监听 data 数据变化。... computed 属性都有一个 get 和一个 set 方法(自己配置),当数据变化时,调用 set 方法。 watch 不支持缓存,发生改变,直接会触发监听事件。...官方文档说明,当我们从一个组件 data 函数返回一个普通 JavaScript 对象时,Vue 会将该对象包裹在一个带有 get 和 set 处理程序 Proxy 。...但若建立一个与 DOM 树对应虚拟 DOM 对象( JavaScript 对象),以对象嵌套方式来表示 DOM 树及其层级结构,那么每次 DOM 更改就变成了对 DOM 对象属性增删改查,这样一来查找...JavaScript 对象属性变化要比查询 DOM 树性能开销小。

20310

Vue数据双向绑定实现原理

vue,我们知道它核心思想是数据驱动视图,表现层我们知道页面上,当数据发生变化,那么视图层也会发生变化。这种数据变化驱动视图背后依靠什么?...每劫持一组对象,每一个属性会实例化一个Dep对象,每个拦截对象属性都会动态添加get和set将传入data或者prop变成响应式,Object.definePropertyget,当我们访问对象某个属性时...,就会先调用get方法,依赖收集调用dep.depend(),当我们设置属性值时就会调用set方法调用dep.notify()``派发更新所有的数据,调用notify时会调用实例Watchrun,...源码里里面处理是相当复杂,我们可以看到访问数据时,会先调用get方法,dep.depend()进行依赖收集,然后再设置对象值时,会调用set方法,派发更新操作。...总结 vue2数据劫持是用Object.defineProperty,当访问对象属性时会触发get方法进行依赖收集,当设置对象属性时会触发set方法进行派发更新操作。

64540

vue响应式原理(数据双向绑定原理)

(UI) - Viewmodel:vue中指vue实例对象,是一个公开公共属性和命令抽象view;是一个转值器,负责转换Model数据对象,来让对象变得更容易管理和使用。...Vue实例对象对象中有Directives和DOM Listeners) vue.js里面只需要改变数据,Vue.js通过Directives指令去对DOM做封装,当数据发生变化,会通知指令去修改对应...Vue实现数据双向绑定原理: 如new Vue一个实例对象a,其中有一个属性a.b,那么实例化过程,通过Object.defineProperty()会对a.b添加getter和setter,同时...任何时候如果javascript对象或者一个HTML输入字段被侦测到发生变化,将代理事件变成发布者-订阅者模式,这会反过来变化广播,并传播到所有绑定javascript对象以及DOM元素上。...首先,需要对observe数据对象进行递归遍历,包括子属性对象属性,都加上setter getter。这样的话,给这个对象某个属性赋值,就会触发setter,那么就能监听到数据变化。

2.6K40

Prototype (原型)

由于所有的“普通”(内置,不是特定主机扩展)对象都“源于”(或者说把 [[Prototype]] 链顶端设置为)这个 Object.prototype 对象,所以它包含 JavaScript 许多通用功能...# 属性设置和屏蔽 myObj.foo = 'bar'; 如果属性名 foo 既出现在 myObject 也出现在 myObject [[Prototype]] 链上层,那么就会发生屏蔽。...总之,不会发生屏蔽。 如果在 [[Prototype]] 链上层存在 foo 并且它是一个 setter,那就一定会调用这个 setter。...JavaScript 只有 对象 JavaScript ,类无法描述对象行为,(因为根本就不存在类!)对象直接定义自己行为。...委托行为 意味着某些对象(XYZ)找不到属性或者方法引用时会把这个请求委托给另一个对象(Task)。

32720

JavaScript 实践+理论(总结篇):作用域、闭包、this、对象原型

JavaScript 实践+理论(总结篇):作用域、闭包、this、对象原型 作用域与闭包 第一章 作用域是什么 • 作用域:根据标识符查找变量一套规则。... JavaScript 什么 typeof null 会返回 object?...当访问对象中一个不存在属性时,[[Get]] 操作就会查找对象内部 [[Prototype]] 关联对象,而这个关联关系就像是嵌套作用域,查找属性时会对其进行遍历查找。...如果对象某个属性不直接存在于某个对象时会发生以下几种情况: myObject.foo = 'bar'; let a = { foo: 'atxt', }; let c = Object.create... JavaScript 对于构造函数最准确解释是,所有带 new 函数调用。 6. 何为原型链?

6310

JavaScript|面向对象 or 基于对象

什么 JavaScript(直到 ES6)有对象概念,但是却没有像其他语言那样,有类概念呢? 为什么 JavaScript 对象里可以自由添加属性,而其他语言却不能呢?...从运行时角度来谈论对象,就是讨论 JavaScript 实际运行模型,这是由于任何代码执行都必定绕不开运行时对象模型。... JavaScript ,将状态和行为统一抽象为“属性”,考虑到 JavaScript 中将函数设计成一种特殊对象,所以 JavaScript 行为和状态都能用属性来抽象。... JavaScript 对象状态和行为其实都被抽象为了属性。...它也有四个特征: 1)getter:函数或 undefined,属性值时被调用。 2)setter:函数或 undefined,设置属性值时被调用。

88120

烂大街Spring循环依赖该如何回答?

Spring对象实例化是通过反射实现,而对象属性则是在对象实例化之后通过一定方式设置。这个过程可以按照如下方式进行理解: ? 大致绘制依赖流程图如下: ?...从图中我们可以很清楚看到,B对象a属性第三步中注入半成品A对象,而A对象b属性第二步中注入成品B对象,此时半成品A对象也就变成了成品A对象,因为其属性已经设置完成了。...所以不会存在什么提高了效率说法 带AOP循环依赖 带AOP不带AOP其实几乎一样,只是在三级缓存存放是函数式接口,需要调用时直接返回代理对象。...三级缓存存在意义: ❝只有真正发生循环依赖时候,才去提前生成代理对象,否则只会创建一个工厂并将其放入到三级缓存,但是不会去通过这个工厂去真正创建对象 ❞ ?...当A、B两个类发生循环引用时,A完成实例化后,就使用实例化后对象去创建一个对象工厂,添加到三级缓存,如果A被AOP代理,那么通过这个工厂获取到就是A代理后对象,如果A没有被AOP代理,那么这个工厂获取到就是

1.2K30

【 JavaSE 】 类和对象

; } } 注意:此处写方法不带 static 关键字 类实例化 定义: 用类类型创建对象过程,称为类实例化 类是模型,限定其中成员有什么实例化出对象占用内存,存储类成员变量...方法间接使用 Getter 是获取这个属性Setter 是修改这个属性 创造getter和setter方法: IDEA 可以使用 alt + insert (或者 alt + F12)...快速生成 setter / getter 方法 VSCode 可以使用鼠标右键 菜单 -> 源代码操作 自动生成 setter / getter 方法 示例: class Person {...;setName 即为 setter 方法, 表示设置这个成员值 当set方法形参名字和类成员属性名字一样时候,如果不使用this, 相当于自赋值. this 表示当前实例引用 不是所有的字段都一定要提供...什么是代码块 使用 {} 定义一段代码 代码块分类: 普通代码块 构造块 静态块 同步代码块 普通代码块 定义: 定义方法代码块(也叫本地代码块) 示例: public class

43720

4.vue 双向绑定原理是什么?_Vue双向绑定原理

当把一个普通 Javascript 对象传给Vue 实例来作为它 data 选项时, Vue 将遍历它属性,用 Object.defineProperty 将 它们转为 ​getter/setter​...,但页面元素无法显示 解决方案如下 解决方案是通过$set方法来设置数组值,该方法有三个参数,第一个是要被设置目标对象,第二个是设置值在数组索引,第三个是设置值 this....,但页面没有发生改变 { {obj.name}} 修改对象属性1 修改对象属性2...html> ✅问题解决 由于data函数未定义对象属性,所以导致双向绑定失败!...解决方案如下 data函数对象初始化对象属性 使用$set设置属性 至此双向绑定完美解决 ♨️往期精彩热文回顾 ✈️ Netty进阶 – WebSocket长连接开发 ✈️ Netty

478120
领券