Object.assign(target, source1,source2)

最新推荐文章于 2025-03-06 09:30:00 发布
原创 最新推荐文章于 2025-03-06 09:30:00 发布 · 193 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文深入探讨了JavaScript中深拷贝和浅拷贝的概念，解释了它们在处理对象复制时的区别。当源对象的属性值为简单数据类型时，拷贝为深拷贝；若属性值为引用数据类型，则拷贝为浅拷贝。理解这两种拷贝方式对于优化代码性能和避免意外修改至关重要。

作用
将可枚举属性的值多个源对象复制到目标对象，并返回对象
如果源对象属性的值是简单数据类型，就是深拷贝；如果源对象属性值为引用数据类型，那么就是浅拷贝

JS `Object.assign()`：对象浅拷贝与合并
weixin_41455464的博客
07-21 1106
这个递归拷贝的函数，可以处理函数，但是仍然不能处理循环引用的情况，为了处理循环引用，需要使用WeakMap来记录已经拷贝过的对象。如果源对象和目标对象有同名属性，那么源对象的属性值会覆盖目标对象的属性值。后面的源对象的属性会覆盖前面源对象的同名属性。递归遍历对象的每一个属性，如果属性值是对象或数组，那么递归调用拷贝函数。它只会复制源对象的第一层属性，如果属性值是对象或者数组，那么复制的仍然是引用。赋值的时候，赋的不是对象本身，而是指向这个对象在内存里的地址的“指针”。是浅拷贝，但它仍然非常有用。
ES6 的Object.assign(target, source_1, ···)方法与对象的扩展运算符
dengling4813的博客
03-25 381
一、基本概念 Object.assign方法用来将源对象（source）的所有可枚举属性，复制到目标对象（target）。它至少需要两个对象作为参数，第一个参数是目标对象，后面的参数都是源对象。 Object.assign(target, source_1, ..., source_n) 二、基本用法 let target = {a: 1}; let obje...
ES6-Object.assign()
wanglei的博客
09-30 139
Object.addign(target, source1, source2) 该方法用于对象的合并，将源对象（source）的所有可枚举属性，复制到目标对象。source1,source2可选，如果只有source,则此方法返回target本身。 const target = { a: 1, b: 1 }; const source1 = { b: 2, c: 2 }; const source2 = { c: 3 }; Object.assign(target, source1, source2).
Object.assign详解
DZQ1223的博客
04-11 8785
分析：从例子中可以看出，当我们修改目标对象的属性值时，源对象的name没有变化，但是grade.chi却被改变了（修改源对象的属性也是同理），因此我们可以看出Object.assign()拷贝的只是属性值，假设源对象的属性值是一个指向对象的引用，那么它也只拷贝那个引用值。1、Object.assign()方法的第一个参数是目标对象，后面的参数都是源对象，Object.assign()方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。这个对象的任何变化，都会反映到目标对象上面。
Object.assign用法
weixin_66128399的博客
03-06 4942
如果只是想将两个或多个对象的属性合并到一起，不改变原有对象的属性，可以用一个空的对象作为target对象。假如源对象的属性值是一个对象的引用，那么它也只指向那个引用。简单来说，就是Object.assign()是对象的静态方法，可以用来复制对象的可枚举属性到目标对象，利用这个特性可以实现对象属性的合并。没有同名的属性会直接复制到目标对象上，同名的属性后面的属性值会覆盖前面的同名属性值。1、Object.assign 方法只会拷贝源对象自身的并且可枚举的属性到目标对象，继承属性和不可枚举属性是不能拷贝的。
js代码-// Object.assign(target, source)
07-15
Object.assign(target, source1, source2, ...); ``` 这里的`target`是接收其他对象属性的目标对象，`source1`, `source2`, ... 是源对象，它们的属性将被合并到目标对象。如果多个源对象有相同的属性，后面的源...
ES6 Object.assign()的用法及其使用
11-21
Object.assign方法用来将源对象（source）的所有可枚举属性，复制到目标对象（target）。它至少需要两个对象作为参数，第一个参数是目标对象，后面的参数都是源对象。 let targetObj1 = { a: 1 }; let sourceObj1 ...
Object.assign()用法学习
m0_72030584的博客
03-06 967
本文讲解Object.assign()用法学习
ES6中的浅复制--Objeck.assign()
weixin_45846357的博客
06-27 210
ES6对象提供了 Object.assign() 这个方法来实现浅复制。 使用assign主要是为了简化对象的混入（mixin）。混入是指的在一个对象中引用另一个对象的属性或方法。 assing可以把一个对象的属性和方法完整的转copy到另外一个对象中。 在es5中复制一个对象，需要很长的一段代码，而es6完全解决了这个问题： var p = { name : "lisi", age : 20, friends : ['张三', '李四'] }
js合并对象和js合并数组
我爱吃红薯的博客
12-10 547
js合并对象 Object.assign(target，xxx，xxx，...) ：将所有可枚举属性的值从一个或多个源对象复制到目标对象 assign<T, U, V>(target: T, source1: U, source2: V): T & U & V; let target={},//目的：要将a,b,c对象复制到target对象中 let a = { a: 1 }; let b = { b: 2 }; let c = { c: 3 }; ...
Object.assign()用法讲解
cxu123321的博客
01-14 1785
Object.assign()用法讲解 Calla_Lj 最后发布于2019-04-23 18:54:32 语法: Object.assign(target, …sources) target: 目标对象,sources: 源对象 用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。 const target = { a: 1, b: 2 }; const source...
ES6之Object.assign()详解
weixin_34092455的博客
09-11 505
**译者按: ** 这篇博客将介绍ES6新增的Object.assign()方法。 原文: ECMAScript 6: merging objects via Object.assign() 译者: Fundebug 为了保证可读性，本文采用意译而非直译。另外，本文版权归原作者所有，翻译仅用于学习。 ...
Object.assign的用法
远方
12-02 1879
Object.assign()方法用于将源对象的所有可枚举属性复制带目标对象 Object.assign方法的第一个参数是目标参数，后面的参数是源对象 var target={a:1}; var source1={b:2}; var source2=[c:3}; Object.assign(target,source1,source2); console.log(target);//{a: 1, ...
关于对象Object.assign(target, …sources) 方法-今日笔记
知其白，守其黑；和其光，同其尘。
08-24 913
Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。 语法：Object.assign(target, …sources) target：目标对象。 sources：源对象。 返回值：目标对象。 描述 如果目标对象中的属性具有相同的键，则属性将被源中的属性覆盖。后来的源的属性将类似地覆盖早先的属性。 Object.assi...
Object.assign()方法
07-15 1150
转载：http://www.cnblogs.com/zhaowenxin/p/6160676.html 对象的扩展 1.ES6中，对象的属性和方法可简写：对象的属性值可不写，前提是属性名已经声明； 1 var name = "zhangsan"; 2 var password = "1111111"; 3 var obj = { 4 ...
ES6--对象
吴声子夜歌的博客
10-15 605
对象字面量 属性的简洁表示法： ES6允许对象的属性直接写变量，这时候属性名是变量名，属性值是变量值。 const age = 12; const name = "Amy"; const person = {age, name}; person //{age: 12, name: "Amy"} //等同于 const person = {age: age, name: name} 方法名也可...
Object.assign
最新发布
08-12
### ### `Object.assign` 的使用方法和特性 `Object.assign` 是 JavaScript 中的一个静态方法，用于将一个或多个源对象的可枚举属性复制到目标对象中。该方法返回目标对象，并且不会修改原型链上的属性。此方法在对象合并、属性覆盖、对象复制等场景中非常实用。 #### 语法 ```javascript Object.assign(target, ...sources) ``` - **参数**： - `target`：目标对象，将接收来自源对象的属性。 - `...sources`：一个或多个源对象，其可枚举属性将被复制到目标对象中。 - **返回值**：返回修改后的目标对象 `target` [^2]。 #### 使用示例 以下是一个基本的使用示例： ```javascript const target = { a: 1 }; const source = { b: 2, c: 3 }; const result = Object.assign(target, source); console.log(result); // 输出: { a: 1, b: 2, c: 3 } ``` 在此示例中，`source` 对象的属性被复制到 `target` 对象中，并且 `target` 被直接修改 [^2]。 #### 特性与注意事项 1. **浅拷贝**：`Object.assign` 执行的是浅拷贝操作，这意味着如果属性值是对象或数组，则复制的是引用而非创建新的副本。 ```javascript const obj1 = { a: { b: 1 } }; const obj2 = {}; Object.assign(obj2, obj1); obj1.a.b = 2; console.log(obj2.a.b); // 输出: 2 ``` 此示例说明，修改嵌套对象的属性会影响目标对象 [^5]。 2. **只复制可枚举属性**：该方法仅复制源对象中可枚举的属性。原型链上的属性不会被复制。 ```javascript const parent = { x: 10 }; const child = Object.create(parent); child.y = 20; const result = Object.assign({}, child); console.log(result); // 输出: { y: 20 } ``` 在此示例中，`x` 属性是原型链上的属性，因此不会被复制 。 3. **与响应式系统的关系**：在 Vue 3 等响应式框架中，使用 `Object.assign` 修改对象属性值不会破坏响应式跟踪，因为该方法不改变对象的引用，仅修改其属性值 [^4]。 4. **属性覆盖**：如果多个源对象具有相同的属性名，则后面的源对象属性会覆盖前面的属性值。 ```javascript const target = { a: 1 }; const source1 = { b: 2 }; const source2 = { b: 3, c: 4 }; Object.assign(target, source1, source2); console.log(target); // 输出: { a: 1, b: 3, c: 4 } ``` 在此示例中，`b` 属性在 `source1` 和 `source2` 中都存在，最终值为 `source2` 的值 [^2]。 #### 与其他对象合并方法的比较 - **展开运算符 `...`**：`Object.assign` 和展开运算符都可以用于合并对象，但它们在语法和行为上有所不同。展开运算符通常用于创建新对象，而 `Object.assign` 则直接修改目标对象。 ```javascript const obj1 = { a: 1 }; const obj2 = { b: 2 }; const newObj = { ...obj1, ...obj2 }; console.log(newObj); // 输出: { a: 1, b: 2 } ``` 展开运算符更适合用于创建新对象而不修改原始对象 [^3]。 - **深拷贝限制**：如果需要深拷贝对象以避免嵌套引用的问题，`Object.assign` 并不适用。可以使用 `JSON.parse(JSON.stringify(obj))` 或第三方库（如 Lodash 的 `_.cloneDeep`）实现深拷贝。 ```javascript const obj = { a: { b: 1 } }; const deepCopy = JSON.parse(JSON.stringify(obj)); obj.a.b = 2; console.log(deepCopy.a.b); // 输出: 1 ``` 此方法可以避免嵌套对象的引用问题，但有局限性，如忽略函数、`Symbol` 和 `undefined` 值 [^5]。 --- ###
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值