JS 中的 assign 方法究竟是 “深克隆” 还是 “浅克隆”？

先说一下答案：assign做的是浅克隆。

“第一层是深克隆，下面的每一层做的是浅克隆” 这种说法其实是错误的。

在我们去探究assign是深克隆还是浅克隆之前，我们必须先明白究竟什么是深克隆、什么是浅克隆？

问了一位大佬，是这么回答的

深浅克隆本质是看克隆后有没有指向同一个内存空间 - 牛客_上岸酱

这就是深、浅克隆的核心区别，网上有数不胜数的回答，但很少有这句话分析地如此简单而又透彻。

回顾一下assign的用法

let obj2 = Object.assign({}, obj1);
assign发挥的作用，就是将obj1的属性克隆到一个空对象（取决于obj1的数据类型）中，然后让obj2指向这个对象。

我们一起看一个例子：

let obj1 = {
  m: 1,
  n: 2,
  attr: {
    name: 'Jack',
    age: 18
  }
}
 
let obj2 = Object.assign({}, obj1);
 
obj1.attr.name = 'Tom';
console.log( obj1.attr.name );  // Tom
console.log( obj2.attr.name );  // Tom
 
obj2.attr.name = 'Jarry';
console.log( obj1.attr.name );  // Jarry

 

可以看到，obj1与obj2的attr依旧是耦合的状态，所以，很明显assign做的就是浅克隆。

还有很多人说，第一层是深克隆，更深的依旧是浅克隆

首先，这种说法一定是错误的。

按照这种说法，由obj1克隆出obj2，assign做的是深克隆。

但我们仔细观察上面的代码，obj2指向的对象，其实并非由assign创建，而是事先由我们创建。assign做的，只是将obj1的属性，克隆到这个事先被我们创建好的空对象中罢了。

注意事项：

assign在做属性拷贝过程，可能会产生异常，比如目标对象的某个只读属性和源对象的某个属性同名，这时该方法会抛出一个 TypeError 异常，拷贝过程中断，已经拷贝成功的属性不会受到影响，还未拷贝的属性将不会再被拷贝。
Object.assign() 拷贝的是属性值。假如源对象的属性值是一个指向对象的引用，它也只拷贝那个引用值。
它无法实现多层的深克隆

我们来实现一个简单的多层深克隆：

function deepCopy(o,c){
  var c = c || {}
  for(var i in o){
    if(typeof o[i] === 'object'){
      // 要考虑深复制问题了
      if(Object.prototype.toString.call(o[i]).slice(8, -1) === Array){
        // 这是数组
        c[i] =[];
      }else{
        //这是对象
        c[i] = {}
      }
      deepCopy(o[i],c[i])
    }else{
      c[i] = o[i]
    }
  }
  return c

这个方法只能作为一种思路，其在真正的应用中，还是会出现很多的问题。

例如出现循环对象该如何处理？（a对象某个属性指向b对象，b对象中某个属性又是指向a对象）
当对象的属性较多、深度够大时，使用递归，在性能上，也有很大的问题。
​​​​​​​ 目前，最好的解决方式，就是 lodash 中的 .cloneDeep(value) 方法，对ES6新增加的大多数数据类型都有考虑，性能上也是十分不错的。
————————————————
原文链接：https://blog.csdn.net/qq_44647809/article/details/114701144

 

 

记录将数组转成对象方法

let array = [1,2,3,4,5];
let  obj ={};
obj = Object.assign({}, array)
console.log(obj);   // {1,2,3,4,5}

 

 

原链接：https://blog.csdn.net/weixin_45689786/article/details/121808586