【前端开发】ES6：Object.assign()

一殊酒

已于 2023-10-04 00:28:10 修改

阅读量118

点赞数

分类专栏：文档解析前端开发文章标签： javascript html5 vue.js

于 2021-09-22 09:48:00 首次发布

本文链接：https://blog.csdn.net/weixin_48348920/article/details/120408882

版权

文档解析同时被 2 个专栏收录

87 篇文章 1 订阅

订阅专栏

前端开发

55 篇文章 4 订阅

订阅专栏

对象合并

用于对象的合并，将源对象(source)的所有可枚举属性，复制到目标对象上

var target = {a: 0};
var source1 = {b: 1};
var source2 = {c: 2};

Object.assign(target, source1, source2);
console.log(target);  // 输出 {a: 0, b: 1, c: 2}

如果目标对象与源对象有同名属性，或多个源对象有同名属性，则后面的属性会覆盖前面的属性

var target = {a: 0, b: 1};
var source1 = {a:1, b: 2, c:3};
var source2 = {c:5};

Object.assign(target, source1, source2);

console.log(target); // 输出 {a: 1, b: 2, c: 5}

如果只有一个target(目标对象)，Object.assign会直接返回该对象

var o = {a: 0};
Object.assign(o);
console.log(o);  // {a: 0}

如果该参数不是对象，则会先转成对象，然后返回。

var a = 1;
Object.assign(a);
console.log(a); // 1
console.log(typeof a); // number
console.log(typeof Object.assign(2)) // object

对于null, undefined 来说无法转换成Object，就会在控制台下报错

Object.assign(null);  // 报错
Object.assign(undefined);  // 报错

对象合并，如果源对象是null的话或者是undefined的话，那么对象合并的时候不会报错，直接会跳过该对象的合并，直接返回目标对象。

var obj = {a: 1};
console.log(Object.assign(obj, null) === obj); // true
console.log(obj); // {a: 1}

var obj = {a: 1};
console.log(Object.assign(obj, undefined) === obj); // true
console.log(obj); // {a: 1}

如果是数值，布尔型，和字符串合并对象的话，都不会报错，但是字符串会以数组的形式表现。

var obj = {a: 1};
console.log(Object.assign(obj, 12) === obj); // true
console.log(obj); // {a: 1}

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

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

console.log(Object('bcd')); // {0: "b", 1: "c", 2: "d", length: 3, [[PrimitiveValue]]: "bcd"}
console.log(Object(1111)); // {[[PrimitiveValue]]: 1111}
console.log(Object(true)); // {[[PrimitiveValue]]: true}