浅谈Object.assign()

Object.assign用于将所有可枚举属性的值从一个或者多个源对象分配到目标对象，最后返回目标对象。通俗一点来说就是合并多个JavaScript的对象。

语法：

Object.assign(target, ...sources)

基本用法：target是目标对象，source1，source2，source3是源对象

var target = {a:1,b:2}
var source1 = {b:6} // 目标对象和source1有同名属性b
var source2 = {c:8}
var source3 = {c:12} // 源对象source2和源对象source3有同名属性c
Object.assign(target,source1,source2,source3)
console.log(target) // 打印结果：{a: 1, b: 6, c: 12}

这里要注意：如果有同名的属性，后面的属性会覆盖前面的属性

Object.assign的第一个参数是传对象数据类型的，如果你第一个参数传的不是对象的话，内部会自动把你传的值转换为对象类型。但是碰到null和undefined的话，程序就会报错。如果源对象的参数位置，接收到了无法转换为对象的参数的话，会忽略这个源对象参数

var source1 = { b: 6 }
var source2 = { c: 8 }
var source3 = { c: 12 }
Object.assign(null, source1, source2, source3) // 报错：Cannot convert undefined or null to object
Object.assign(undefined, source1, source2, source3) // 报错：Cannot convert undefined or null to object
console.log(Object.assign(false,source1,source2,source3)) // 打印：Boolean {false, b: 6, c: 12}
console.log(Object.assign(0,source1,source2,source3)) // 打印：Number {0, b: 6, c: 12}
console.log([1,2],source1,source2,source3) // 打印：[1, 2] {b: 6} {c: 8} {c: 12}

有一个特殊的例子，如果源对象是个字符串，那么结果是什么呢？

var source1 = 'abc'
var source2 = {name:'张三'}
var source3 = true
var source4 = 1
const obj = Object.assign({},source1,source2,source3,source4)
console.log(obj) // 打印结果：{0: "a", 1: "b", 2: "c", name: "张三"}

为什么结果是这样的呢？首先'abc'被转成对象就是{0:a,1:b,2:c}，true和1虽然被转成了对象，但是属性确是不可枚举的， assign不会合并不可枚举的属性，所以他们并没有被成功合并进去

Object.assign的常见用途

1、给对象添加属性

var target = {
    name: '张三',
    age: 18
}
var a = {
    page:1,
    pagesize:10
}
var b = {
    address: '上海市'
}
Object.assign(target,a,b)
console.log(target) // {name: "张三", age: 18, page: 1, pagesize: 10, address: "上海市"}

2、为对象添加方法

function Person() {}
Object.assign(Person.prototype,{
    someMethod(par1,par2){...},
    anotherMethod() {...}
})

3、深拷贝

//克隆对象的方法
function clone(origin) {
    //获取origin的原型对象
    let originProto = Object.getPrototypeOf(origin);
    //根据原型对象，创建新的空对象，再assign
    return Object.assign(Object.create(originProto), origin);
}
var a = {
    age: 18
}
var b = clone(a)
b.age = 60
console.log(a.age) // 18
console.log(b.age) // 60