前端面试题3：Object.assign的使用

一、Object.assign是什么？

      首先了解下Object.assign()是什么。我们先看看ES6官方文档是怎么介绍的？

      Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。

      简单来说，就是Object.assign()是对象的静态方法，可以用来复制对象的可枚举属性到目标对象，利用这个特性可以实现对象属性的合并。

二、用法：

      Object.assign(target, ...sources)

  参数：target--->目标对象

      source--->源对象

  返回值：target，即目标对象

三、使用示例：

1、目标对象和源对象无重名属性

var target={name:'guxin',age:18};
var source={state:'single'}
var result=Object.assign(target,source);
console.log(target,target==result);

结果如图：

我们可以看到source上的state属性合并到了target对象上。如果只是想将两个或多个对象的属性合并到一起，不改变原有对象的属性，可以用一个空的对象作为target对象。像下面这样：

var result=Object.assign({},target,source);

2、目标对象和源对象有重名属性

上面的示例目标对象和源对象是没有重名属性的，那么如果他们有重名属性又会怎样呢？是后面的属性覆盖前面的还是前面的属性覆盖后面的呢？我们接下来看下一个例子：

var target={name:'guxin',age:18}
var source={state:'signle',age:22}
var result=Object.assign(target,source)
console.log(target)

我们来看下运行结果：

可以看到如果有同名属性的话，后面的属性值会覆盖前面的属性值。

3、有多个源对象

前面的示例都是只有一个源对象，那么如果有多个源对象情况会不会不同呢？我们继续看下面的例子：

       

var target={name:'guxin',age:18}
        var source1={state:'signle',age:22}
        var source2={mood:'happy',age:25}
        var result=Object.assign(target,source1,source2)
        console.log(target)

我们来看下运行结果：

可以看到有多个源对象情况也是和一个源对象一样的。没有同名的属性会直接复制到目标对象上，同名的属性后面的属性值会覆盖前面的同名属性值。

四、Object.assign是深拷贝还是浅拷贝

1. 如果对象的obj属性值为简单数据类型，通过Object.assign 拷贝得到的新对象为深拷贝

2. 如果obj属性值为对象或其他引用类型，那么就是浅拷贝