Object.assign() 方法的使用详解

Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。

注意：会改变源对象

语法：

Object.assign(target, ...sources)

target 目标对象。

sources 源对象。

1. 目标对象中的属性具有相同的键，则属性将被源对象中的属性覆盖。后面的源对象的属性将类似地覆盖前面的源对象的属性。

2. Object.assign 方法只会拷贝源对象自身的并且可枚举的属性到目标对。

3. String类型和 Symbol 类型的属性都会被拷贝。

举例：

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };const returnedTarget = Object.assign(target, source);console.log(target); // 源对象
//  { a: 1, b: 4, c: 5 }console.log(returnedTarget);
//  { a: 1, b: 4, c: 5 }

Object.assign()拷贝的是属性值

假如源对象的属性值是一个对象的引用，那么它也只指向那个引用。

let obj1 = { a: 0 , b: { c: 0}};
let obj2 = Object.assign({}, obj1);
console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}} obj1.a = 1;
console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}} obj2.a = 2;
console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 0}}obj2.b.c = 3;  // 此时两个对象下b指向的是一个位置。
console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 3}}
console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 3}} // 可以实现深拷贝
obj1 = { a: 0 , b: { c: 0}};
let obj3 = JSON.parse(JSON.stringify(obj1));  // 此时相当于重建了对象
obj1.a = 4;
obj1.b.c = 4;
console.log(JSON.stringify(obj3)); // { a: 0, b: { c: 0}}

合并具有相同属性的对象，属性被后续参数中具有相同属性的其他对象覆盖

// 普通合并对象
const o1 = { a: 1 };
const o2 = { b: 2 };
const o3 = { c: 3 };const obj = Object.assign(o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1);  // { a: 1, b: 2, c: 3 }, 注意目标对象自身也会改变。// 此时对象之间有相同值
const o1 = { a: 1, b: 1, c: 1 };
const o2 = { b: 2, c: 2 };
const o3 = { c: 3 };const obj = Object.assign({}, o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }   后边的覆盖前边的

继承属性和不可枚举属性是不能拷贝的

const obj = Object.create({foo: 1}, { //  根据Object.create（）foo是个继承属性。bar: {value: 2  // 根据这个写法，bar 是个不可枚举属性 。},baz: {value: 3,enumerable: true  // baz 是个自身可枚举属性。}
});const copy = Object.assign({}, obj);
console.log(copy); // { baz: 3 }

如果上方这个代码不是很懂，参考这篇

https://blog.csdn.net/weixin_41229588/article/details/106400071

Object.assign() 方法的使用详解相关推荐

Object.defineProperty()方法的用法详解
Object.defineProperty()函数是给对象设置属性的. Object.defineProperty(object, propertyname, descriptor); 一共有三个参数 ...
python类是实例的工厂_Python设计模式之工厂方法模式实例详解
本文实例讲述了Python设计模式之工厂方法模式.分享给大家供大家参考,具体如下: 工厂方法模式(Factory Method Pattern):定义一个用于创建对象的接口,让子类决定实例化哪一个类, ...
getordefault java_Java map.getOrDefault()方法的用法详解
Map.getOrDefault(Object key, V defaultValue)方法的作用是: 当Map集合中有这个key时,就使用这个key值: 如果没有就使用默认值defaultValue ...
Incremental Learning of Object Detectors without Catastrophic Forgetting详解
Incremental Learning of Object Detectors without Catastrophic Forgetting详解最近由于项目的需要在研究incremental l ...
layui数据表格解析html,layui框架table 数据表格的方法级渲染详解
layui框架table 数据表格的方法级渲染详解如下所示: //js 规范书写 var tst=table.render({ elem: '#test11' ,cols: [[ //标题栏 {ch ...
python frozenset_Python中set与frozenset方法和区别详解
set(可变集合)与frozenset(不可变集合)的区别: set无序排序且不重复,是可变的,有add(),remove()等方法.既然是可变的,所以它不存在哈希值.基本功能包括关系测试和消除重复元 ...
Object.keys（）的详解和用法
Object.keys()的详解和用法在实际开发中,我们有时需要知道对象的所有属性; ES5 引入了Object.keys方法,成员是参数对象自身的(不含继承的)所有可遍历( enumerable ...
oracle home 命令,$ORACLE_HOMEbin目录下所有命令的使用方法及命令详解
求$ORACLE_HOME/bin目录下所有命令的使用方法及命令详解如题. $ORACLE_HOME/bin目录下有很多命令,那我们平时用到的也不是太多,即使用到的那部分可能用法也不是完全能掌握,所 ...
JavaScript 复制对象与Object.assign方法无法实现深复制
在JavaScript这门语言中,数据类型分为两大类:基本数据类型和复杂数据类型.基本数据类型包括Number.Boolean.String.Null.String.Symbol(ES6 新增),而复 ...

Object.assign() 方法的使用详解

Object.assign() 方法的使用详解相关推荐

最新文章

热门文章