Object.assign

文章目录

1. 1. 1.简介
2. 2. 2.基本用用法
3. 3. 3.注意事项
4. 4. 4.常见用途

1.简介

Object.assign()是es6新增的接口,用来合并多个对象.

2.基本用用法

Object.assign(target, ...sources );

用于合并多个对象,将源对象(source)的所有可枚举属性,复制到目标对象(target).

3.注意事项

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

var target = { a: 1, b: 1 };
var source1 = { b: 2, c: 2 };
var source2 = { c: 3 };
Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}

2.如果只有一个参数，Object.assign会直接返回该参数。

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

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

typeof Object.assign(2) // "object"

4.由于undefined和null无法转成对象，所以如果它们作为参数，就会报错。

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

5.如果非对象参数出现在源对象的位置（即非首参数），那么处理规则有所不同。首先，这些参数都会转成对象，如果无法转成对象，就会跳过。这意味着，如果undefined和null不在首参数，就不会报错。

et obj = {a: 1};
Object.assign(obj, undefined) === obj // true
Object.assign(obj, null) === obj // true

4.常见用途

1.为对象添加属性

class Point {
	constructor(x, y) {
		Object.assign(this, {x, y});
	}
}

上面方法通过Object.assign方法，将x属性和y属性添加到Point类的对象实例。

2.为对象添加方法

Object.assign(SomeClass.prototype, {
	someMethod(arg1, arg2) {
	···
	},
	anotherMethod() {
	···
	}
});
//  等同于下面的写法
SomeClass.prototype.someMethod = function (arg1, arg2) {
···
};
SomeClass.prototype.anotherMethod = function () {
···
};

面代码使用了对象属性的简洁表示法，直接将两个函数放在大括号中，再使用 assign 方法添加到 SomeClass.prototype 之中。

3.为属性指定默认值

const DEFAULTS = {
	logLevel: 0,
	outputFormat: 'html'
};
function processContent(options) {
	let options = Object.assign({}, DEFAULTS, options);
}

上面代码中，DEFAULTS对象是默认值，options对象是用户提供的参数。Object.assign方法将DEFAULTS和options合并成一个新对象，如果两者有同名属性，则option的属性值会覆盖DEFAULTS的属性值。
注意，由于存在深拷贝的问题，DEFAULTS对象和options对象的所有属性的值，都只能是简单类型，而不能指向另一个对象。否则，将导致DEFAULTS对象的该属性不起作用。

4.合并多个对象

const merge =(target, ...sources) => Object.assign(target, ...sources);

5.克隆对象

function clone(origin){
    //获取origin的原型对象
    let originProto = Obejct.getPrototypeOf(origin);
    //根据原型对象，创建新的空对象，再assign
    return Object.assign(Object.create(originProto),origin);
}