js assign(JavaScript使用assign合并对象)

什么是JavaScript中的assign方法？

JavaScript中的assign方法是用于将属性从一个或多个对象复制到目标对象的方法。这个方法的语法如下：

Object.assign(target, …sources)

此时，target是接收源对象属性的目标对象，而sources则是一个或多个源对象。

如何使用assign方法合并对象？

使用assign方法合并对象很简单，只需要将目标对象和要合并的源对象传递给assign方法即可：

const obj1 = {name: "John", age: 30};

const obj2 = {gender: "Male"};

const mergedObj = Object.assign(obj1, obj2);

在上述代码中，我们将obj1和obj2两个对象合并成mergedObj，同时也改变了obj1的属性。如果我们只是想将两个对象复制到一个新的对象上而不改变原始对象，我们可以创建一个空对象，然后将源对象复制到这个新对象上：

const obj1 = {name: "John", age: 30};

const obj2 = {gender: "Male"};

const mergedObj = Object.assign({}, obj1, obj2);

assign方法的注意事项

在使用Object.assign方法时，需要注意以下几点：

如果目标对象属性存在相同的key，则源对象属性将覆盖目标对象属性。

如果有多个源对象具有相同的属性，则最后一个源对象的属性将覆盖前面的属性。

如果要合并的对象是null或undefined，则将会导致TypeError。

assign方法的应用场景

Object.assign方法在实际的开发中有许多应用场景：

合并多个对象

可以通过Object.assign方法实现浅拷贝

可以用于将属性复制到react组件的state中，从而实现组件状态的更新。

实现深拷贝的assign方法

Object.assign方法只能实现浅拷贝，如果需要实现深拷贝，我们可以借助其他工具库，例如lodash和jQuery。下面是一个简单的实现：

```

function deepAssign(target, ...sources) {

sources.forEach(source => {

Object.entries(source).forEach(([key, val]) => {

if (val && typeof val === 'object') {

if (!target[key]) Object.assign(target, { [key]: {} })

deepAssign(target[key], val)

} else {

Object.assign(target, { [key]: val })

}

})

})

return target

}

```

上述代码中，我们将目标对象和源对象传递给deepAssign方法，在方法内部遍历源对象属性并递归地将其复制到目标对象上。

结论

JavaScript中的Object.assign方法是实现对象合并的常用方法，它可以快速地复制源对象属性到目标对象中。同时，这个方法也有一些需要注意的使用细节，例如目标对象上的相同key会被覆盖。我们还可以通过其他工具库实现深拷贝。