昨天学到了Object.assign的使用，今天记录一下。
（我这四处漏风的基础知识ε=(´ο｀*)))
起因是我有这样一段代码：
airLinePath = config.airLinePath ? config.airLinePath : [];
airSapcePath = config.airSapcePath ? config.airSapcePath : [];
我有两个变量airLinePath 和airSapcePath，在页面初始化时，我会读取某个值，赋值给config对象；
当存在config.airLinePath和config.airSapcePath时，将它们赋值给我自己定义的airLinePath 和airSapcePath，如果config中不存在这两个属性，就将这两个变量赋值为空数组。
然后领导提出了一个问题：如果你需要读取config中的十几个变量的话，也要写十几行判断吗？
我当场哽住，然后领导就教给了我这个好用的Object.assign。
先复制一下官方文档中的介绍：Object.assign方法用于对象的合并，将源对象（source）的所有可枚举属性，复制到目标对象（target）。
let a = { a: 1 };
let b = { b: 2 };
let c = { c: 3 };
let target = { a: 0 };
Object.assign(target, a, b, c);
console.log(target); //{ a: 1, b: 2, c: 3 }
Object.assign方法的第一个参数是目标对象，后面的参数都是源对象。
如果目标对象与源对象有同名属性，或多个源对象有同名属性，则后面的属性会覆盖前面的属性。
所以针对我的代码，可以这样修改，新定义一个对象tempConfig作为target，config作为source：
let tempConfig = Object.assign({ airLinePath: [], airSpacePath: [] }, config);
如果config中存在airLinePath和airSpacePath的话，那么tempConfig中的airLinePath和airSpacePath的值就会被覆盖，如果不存在，那么tempConfig中的airLinePath和airSpacePath就会使用默认值[]，在访问时，通过tempConfig访问即可，就算有十几个变量需要判断，也只需要使用一行代码。
let config = {
airLinePath: [1, 2, 3, 4, 5],
airSpacePath: [1, 2],
};
let tempConfig = Object.assign({ airLinePath: [], airSpacePath: [] }, config);
console.log(tempConfig); // { airLinePath: [1,2,3,4,5], airSpacePath: [1,2] }
let config = {
airSpacePath: [1, 2],
};
let tempConfig = Object.assign({ airLinePath: [], airSpacePath: [] }, config);
console.log(tempConfig); // { airLinePath: [], airSpacePath: [1,2] }
一些注意点：
- 如果只有一个参数，
Object.assign会直接返回该参数。 -
undefined和null无法转成对象，所以如果它们作为参数，就会报错，除非他们不在首位，这样会被跳过。 - 字符串会以数组形式拷入目标对象
Object.assign({}, "abcd"); // {0: "a", 1: "b", 2: "c", 3: "d"} -
Object.assign拷贝的属性是有限制的，只拷贝源对象的自身属性（不拷贝继承属性），也不拷贝不可枚举的属性（enumerable: false） -
Object.assign方法实行的是浅拷贝，而不是深拷贝。也就是说，如果源对象某个属性的值是对象，那么目标对象拷贝得到的是这个对象的引用。
let obj1 = { a: { b: 1 } };
let obj2 = Object.assign({}, obj1);
console.log(obj2.a.b); // 1
obj1.a.b = 100;
console.log(obj2.a.b); // 100
-
Object.assign可以用来处理数组，但是会把数组视为对象。
Object.assign([1, 2, 3], [4, 5]); //[4,5,3] -
Object.assign可以用来给对象添加方法：
class myClass {
x: number;
y: number;
constructor(x: number, y: number) {
this.x = x;
this.y = y;
}
}
Object.assign(myClass.prototype, {
getValue() {
console.log(this.x + this.y);
},
});
let a = new myClass(1, 2);
a.getValue(); // 3
-
Object.assign可以用来克隆对象：
const cloneObj = (origin: any) => {
return Object.assign({}, origin);
};
let a = cloneObj({ a: 1, b: 2 }); // { a: 1, b: 2 }
不过，采用这种方法克隆，只能克隆原始对象自身的值，不能克隆它继承的值。如果想要保持继承链，可以使用Object.create和Object.getPrototypeOf方法。
const cloneObj = (origin: any) => {
let originPrototype = Object.getPrototypeOf(origin);
return Object.assign(Object.create(originPrototype), origin);
};
