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

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

用法示例:
复制一个对象

 const obj = { a: 1 };
const copy = Object.assign({}, obj);
console.log(copy); // { a: 1 }

深拷贝问题
针对深拷贝,需要使用其他办法,因为 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;
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}, { // foo 是个继承属性。
bar: {
value: 2 // bar 是个不可枚举属性。
},
baz: {
value: 3,
enumerable: true // baz 是个自身可枚举属性。
}
}); const copy = Object.assign({}, obj);
console.log(copy); // { baz: 3 }

原始类型会包装为对象

 const v1 = "abc";
const v2 = true;
const v3 = 10;
const v4 = Symbol("foo") const obj = Object.assign({}, v1, null, v2, undefined, v3, v4);
// 原始类型会被包装,null 和 undefined 会被忽略。
// 注意,只有字符串的包装对象才可能有自身可枚举属性。
console.log(obj); // { "0": "a", "1": "b", "2": "c" }

拷贝Symbol类型的属性

 const o1 = { a: 1 };
const o2 = { [Symbol('foo')]: 2 }; const obj = Object.assign({}, o1, o2);
console.log(obj); // { a : 1, [Symbol("foo")]: 2 } (cf. bug 1207182 on Firefox)
Object.getOwnPropertySymbols(obj); // [Symbol(foo)]

异常会打断后续的拷贝

 const target = Object.defineProperty({}, "foo", {
value: 1,
writable: false
}); // target 的 foo 属性是个只读属性。 Object.assign(target, {bar: 2}, {foo2: 3, foo: 3, foo3: 3}, {baz: 4});
// TypeError: "foo" is read-only
// 注意这个异常是在拷贝第二个源对象的第二个属性时发生的。 console.log(target.bar); // 2,说明第一个源对象拷贝成功了。
console.log(target.foo2); // 3,说明第二个源对象的第一个属性也拷贝成功了。
console.log(target.foo); // 1,只读属性不能被覆盖,所以第二个源对象的第二个属性拷贝失败了。
console.log(target.foo3); // undefined,异常之后 assign 方法就退出了,第三个属性是不会被拷贝到的。
console.log(target.baz); // undefined,第三个源对象更是不会被拷贝到的。

拷贝访问器

 const obj = {
foo: 1,
get bar() {
return 2;
}
}; let copy = Object.assign({}, obj);
console.log(copy); // { foo: 1, bar: 2 } copy.bar的值来自obj.bar的getter函数的返回值 // 下面这个函数会拷贝所有自有属性的属性描述符
function completeAssign(target, ...sources) {
sources.forEach(source => {
let descriptors = Object.keys(source).reduce((descriptors, key) => {
descriptors[key] = Object.getOwnPropertyDescriptor(source, key);
return descriptors;
}, {}); // Object.assign 默认也会拷贝可枚举的Symbols
Object.getOwnPropertySymbols(source).forEach(sym => {
let descriptor = Object.getOwnPropertyDescriptor(source, sym);
if (descriptor.enumerable) {
descriptors[sym] = descriptor;
}
});
Object.defineProperties(target, descriptors);
});
return target;
} copy = completeAssign({}, obj);
console.log(copy);
// { foo:1, get bar() { return 2 } }

原文链接:https://blog.csdn.net/Calla_Lj/article/details/89478765

Object.assign()的用法 -- 用于将所有可枚举属性的值从一个或多个源对象复制到目标对象,返回目标对象的更多相关文章

  1. Object.assign() 从一个或多个源对象复制到目标对象

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

  2. ES6的Object.assign()基本用法

    Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target). 例如: const target = {a:1}, const source1 ...

  3. Object.assign的用法

    工作中使用的Object.assign 类的赋值 var initData = { a:'', b:'' } var oldData = { a:'ww', b:'ee' } var newData ...

  4. 浅谈Object.assign()

    Object.assign()方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象.返回值为目标对象. 1 Object.assign 是 ES6 新添加的接口,主要的用途是用来合并多个 Ja ...

  5. 浅谈对象的两个方法:Object.keys() ,Object.assign();

    1 : Object.keys(obj) 返回给定对象的所有可枚举属性的字符串数组 例子1: var arr = [1, 2, 6, 20, 1]; console.log(Object.keys(a ...

  6. js 合并多个对象 Object.assign

    Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象.它将返回目标对象. var o1 = { a: 1 };var o2 = { b: 2 };var o3 ...

  7. javascript学习总结之Object.assign()方法详解

    最近再写ES6的文章时候发现自己对Object.assign()方法不太了解,之前也没有接触过所以就就查阅了相关的资料,为了自己以后肯能会用到以及对知识进行巩固,所以在这里记录下自己学习的点点滴滴,毕 ...

  8. Object.assign()的使用

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

  9. 【进阶4-2期】Object.assign 原理及其实现 (转)

    这是我在公众号(高级前端进阶)看到的文章,现在做笔记  https://github.com/yygmind/blog/issues/26 浅拷贝 Object.assign 上篇文章介绍了其定义和使 ...

随机推荐

  1. Loadrunner:管理员权限启动报错“win10 为了对电脑进行保护,已经阻止此应用”

    问题 最近在尝试做性能测试,由于 Loadrunner 必须用管理员身份启动(普通用户权限启动会遇到各种权限不足的问题) 但是用管理员身份启动时,报错了:win10 为了对电脑进行保护,已经阻止此应用 ...

  2. 《Python基础教程》第四章:字典

    字典中的值没有特殊的顺序 电话号码(以及其他可能以0开头的数字)应该表示为数字字符串,而不是整数 dict函数可以通过序列对建立字典 clear方法清除字典中所有的项.这是个原地操作,无返回值 get ...

  3. 用python 遍历文件夹中所有.dcm文件

    import dicomimport os def eachFile(filepath): for file in os.listdir(filepath): child = os.path.join ...

  4. five rendering ideas 里获取csm的 shadow边界做 pcf

    http://advances.realtimerendering.com/s2011/White,%20BarreBrisebois-%20Rendering%20in%20BF3%20(Siggr ...

  5. k8s 1.16.3 yaml声明变化

    apiVersion: apps/v1 #变化的 kind: Deployment metadata: name: taint labels: app: taint spec: replicas: 3 ...

  6. webpack打包工具之ts版开发框架搭建

    本文用两个框架,一个是threejs,一个是phaser3,其实流程都是一样. nodejs.npm是基础,不再多说! 首先新建一个文件夹命名three-study,然后npm init -y 用we ...

  7. 关于java代理(静态代理和动态代理)

    参考文章:http://kuangbaoxu.iteye.com/blog/193240

  8. cogs908. 校园网

    908. 校园网 ★★   输入文件:schlnet.in   输出文件:schlnet.out   简单对比时间限制:1 s   内存限制:128 MB USACO/schlnet(译 by Fel ...

  9. Java Web项目案例之---登录注册和增删改查(jsp+servlet)

    登录注册和增删改查(jsp+servlet) (一)功能介绍 1.用户输入正确的密码进行登录 2.新用户可以进行注册 3.登录后显示学生的信息表 4.可以添加学生 5.可以修改学生已有信息 6.可以删 ...

  10. Python基础之Python解释器

    当我们在编写Python代码时,我们得到的是一个包含Python代码的,以.py为扩展名的文本文件.要运行代码,就需要Python解释器去执行.py文件. 由于整个Python语言从规范到解释器都是开 ...