当前位置: 首页
前端开发
Object.assign 拷贝访问器属性的处理机制

Object.assign 拷贝访问器属性的处理机制

热心网友 时间:2026-07-03
转载

你可能觉得 Object assign 只是个简单的“复制”工具,把源对象的属性一股脑搬到目标对象上就完事。但事实上,它对访问器属性(即通过 get set 定义的属性)的处理方式,远没有你想象的那么“智能”。直白点说,它只复制属性值,不会复制“行为”——这正是许多 JavaScript 开发者容易

你可能觉得 Object.assign 只是个简单的“复制”工具,把源对象的属性一股脑搬到目标对象上就完事。但事实上,它对访问器属性(即通过 get/set 定义的属性)的处理方式,远没有你想象的那么“智能”。直白点说,它只复制属性值,不会复制“行为”——这正是许多 JavaScript 开发者容易踩坑的地方。

Ja vaScript 中 Object.assign 在拷贝过程中对访问器属性的处理

先明确一个核心结论:Object.assign 在拷贝过程中,既不会调用源对象上的 getter,也不会在目标对象上保留 setter。它执行的是纯粹的“属性值”浅拷贝,对访问器属性的处理机制非常特殊,也极易被忽略,理解这一点对于掌握 JavaScript 对象拷贝 的深层原理至关重要。

访问器属性会被转为普通数据属性

如果源对象的某个属性是用 get / set 定义的访问器属性,Object.assign 会读取该属性当前的返回值——即调用一次 getter 拿到结果,然后把这个值作为普通数据属性直接赋给目标对象。最终结果是:目标对象上对应的键变成了一个可读写的普通数据属性,彻底丢失了 getter/setter 行为。换句话说,Object.assign 浅拷贝 并不会保留属性描述符中的 getset 定义。

  • 源对象的 getter 不会被复制,只有它的返回值以“快照”方式写入目标对象
  • 源对象的 setter 完全丢失,目标对象上的同名属性再也无法触发任何 setter 逻辑
  • 后续你对目标对象该属性的修改,完全不会影响源对象,也不会触发任何访问器行为

无法继承或还原原始的访问器定义

这种表现背后的机制其实不复杂:Object.assign 基于 [[Get]][[Set]] 内部操作,而非 Object.getOwnPropertyDescriptor 搭配 Object.defineProperty。因此它不会保留属性的 configurableenumerablewritable 等特性,更不用说 get / set 函数本身了。如果你想实现 保留访问器属性的拷贝,必须采用更底层的方法。

  • 即使源属性是不可枚举的,只要它能被 for...inObject.keys 遍历到(即 enumerable: true),就会被拷贝
  • 若要完整保留访问器定义,必须手动使用 Object.getOwnPropertyDescriptors 配合 Object.defineProperties 来实现

实际例子说明行为差异

来看一个具体的示例,直观感受 JavaScript 访问器属性拷贝 的差异:

const src = {
  _value: 42,
  get foo() { return this._value * 2; },
  set foo(v) { this._value = v / 2; }
};

const target = {};
Object.assign(target, src);

console.log(target.foo); // 84(getter 被执行一次,结果被固化)
target.foo = 100;
console.log(target.foo); // 100(已变成普通数据属性,不再触发 setter)
console.log(src._value); // 42(未改变,setter 没生效)

看到了吗?target.foo 现在是一个纯数据属性,与 src 的访问器逻辑彻底脱钩。无论你后续如何修改它,都不会影响源对象,因为 setter 已经彻底丢失了。这个例子清楚地展示了 Object.assign 对 getter/setter 的处理 与直觉之间的差距。

需要保留访问器时的替代方案

如果你需要进行深拷贝,或者想要保留访问器以及属性描述符等元信息,那就得换一种方式,不要直接使用 Object.assign

  • 使用 Object.getOwnPropertyDescriptors(src) 获取完整的属性描述符
  • 再通过 Object.defineProperties(target, descriptors) 将它们复制到目标对象
  • 注意:这仍然是浅拷贝,如果嵌套对象或访问器内部逻辑较为复杂,还需要额外处理才能实现真正意义上的 JavaScript 深拷贝保留访问器
来源:https://www.php.cn/faq/2734462.html

游乐网为非赢利性网站,所展示的游戏/软件/文章内容均来自于互联网或第三方用户上传分享,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系youleyoucom@outlook.com。

同类文章
更多
用Object.getPrototypeOf动态检测前端灰度发布组件白名单

用Object.getPrototypeOf动态检测前端灰度发布组件白名单

Object getPrototypeOf作为原型校验器,在白名单机制中验证组件实例的直接原型是否合法。白名单为构造函数prototype对象的强引用快照,需在第三方脚本前采集。校验失败后按灰度策略分级响应,并配合冻结原型链、拦截篡改入口等防御措施。

时间:2026-07-14 07:06
箭头函数在定时器中的应用实例

箭头函数在定时器中的应用实例

箭头函数在定时器回调中自动继承外层this,避免了传统函数this指向全局或undefined的问题,无需手动bind或保存闭包变量。但其无法改变this指向,且没有arguments对象,也不能用作构造器。使用时应理解词法作用域与执行上下文的区别。

时间:2026-07-14 07:06
JavaScript原型式继承写法与应用场景详解

JavaScript原型式继承写法与应用场景详解

原型式继承通过Object create()以现有对象为模板创建新对象,实现行为复用而非数据复制。适用于配置派生、游戏实体等轻量场景,但需注意引用类型共享、无法传参初始化及类型识别失效等限制。

时间:2026-07-14 07:05
JavaScript对象字面量writable属性的默认配置机制完全解析

JavaScript对象字面量writable属性的默认配置机制完全解析

对象字面量中属性描述符默认全部开启,writable为true可直接赋值修改;而Object defineProperty定义的属性,writable、configurable、enumerable均默认为false,需手动设为true才能修改或枚举。两者默认行为差异显著。

时间:2026-07-14 07:05
JavaScript浮点数比较布尔值逻辑错误避免方法

JavaScript浮点数比较布尔值逻辑错误避免方法

JavaScript浮点数采用IEEE754双精度标准,二进制存储导致小数运算精度损失,直接使用`==`或`===`比较常出现逻辑错误。通常引入容差比较,如`Math abs(a-b)

时间:2026-07-14 07:05
热门专题
更多
刀塔传奇破解版无限钻石下载大全 刀塔传奇破解版无限钻石下载大全
洛克王国正式正版手游下载安装大全 洛克王国正式正版手游下载安装大全
思美人手游下载专区 思美人手游下载专区
好玩的阿拉德之怒游戏下载合集 好玩的阿拉德之怒游戏下载合集
不思议迷宫手游下载合集 不思议迷宫手游下载合集
百宝袋汉化组游戏最新合集 百宝袋汉化组游戏最新合集
jsk游戏合集30款游戏大全 jsk游戏合集30款游戏大全
宾果消消消原版下载大全 宾果消消消原版下载大全
  • 热门数据榜