9-对象的新增方法之assign

Object.assign()方法是ES6里面对象的扩展。它的功能是将源对象的属性或方法复制到目标对象上面。

一、使用

Object.assign()，将源对象的所有可枚举属性复制到目标对象。

方法里面的第一个参数为目标对象，后面的为源对象。如果两种对象存在同名属性，后面的会覆盖掉前面的。如果不写源对象，则只返回目标对象。

let ta={a:1};
let s1={b:2,name:'',};
Object.assign(ta,s1);

  

二、注意点

（1）该方法是浅复制，也就是说，如果源对象的某个属性的值是对象，那么目标对象复制得到的是这个对象的引用。

也就像是一个指针，指向该属性值所在的位置，所以里面的值变化，得到的也会变化。代码如下：

var obj2={name:"Baidu"};
let obj3={func:findLike,like:{intrest:["sing","sleep"],reading:['王小波','文森鱼']}};
Object.assign(obj2,obj3);
obj3.like.reading="纳博科夫";
console.log(obj3.like.reading);//纳博科夫
console.log(obj2.like.reading);//纳博科夫

 浅复制的麻烦在于同名属性的覆盖，如果有同名属性，源对象的属性值会替换掉目标对象的属性值。但是我们通常希望原来的属性加上源对象的属性，即想要扩展，而不是替换掉，所以要注意。

-

（2）如果源对象为一个数组，会将index当做属性名，存入目标对象中。 

var obj2={name:"Baidu"};
Object.assign(obj2,[0,1,2]);
console.log(obj2)//{0: 0, 1: 1, 2: 2, name: "Baidu"}

三、assign的常见用途

（1）为对象添加属性

（2）为对象添加方法

（3）克隆对象

（4）合并对象

（5）为属性指定默认值

注意，由于浅复制，如果存在同名属性，目标对象和源对象只能是简单类型。否则，源对象的同名属性会彻底覆盖目标对象的同名属性，而不是扩展目标对象的属性。

比如下面这段代码，两个对象存在同名属性url，本意是想要只修改port，但因为浅复制，把host用空给覆盖掉了，只剩下了重新赋值的port.

const defaultUrl={
    url:{host:'aaa.com',port:'7070'},
}
function processContent(option){
    let obj = {}
    Object.assign(obj, defaultUrl,option);
    console.log('obj-->>', obj); // {url: {port: "8000"}}
}
var newUrl=processContent({url:{port:"8000"}});