js之深浅拷贝

标签（空格分隔）： javascript

---

说在前面

javascript中的变量类型分为两大类，基本数据类型与引用数据类型，其中基本值类型包括

• Number
• String
• Boolean
• Null
• undefine

引用类型指的是包含多个值的对象。本质上，栈内存中保存固定不变的值，堆内存则保存的更多的是引用类型，但是引用类型的地址保存在栈内存中， 我们要以通过地址来访问。

由于这种方式保存方式， 当访问基本类型时， 可以通过值来访问。当访问引用类型时，通过保存在变量的引用类型的地址来实际操作，就会出现深浅复制的问题

浅拷贝

// 例如 两个对象
var  obj1 =  {
  a: "123",
  b: "456"
}

var obj2 = {} 
// 由于a,b 的值都是原始值基本类型所以 

// 方法一
clone(o1, o2){
  for(var key in o1){
    o2[key] = o1[key]
  }
  return o2
 }
 clone(obj1, obj2)
 
// 方法二
Object.assign()   // (兼容性一般)

// 方法三 
// 数组中的 concat 和 slice

// 方法四
ES6 中的展开运算符号
var arr = [{name:'xiaolong',age:18}]
var arr2 = [...arr]

深拷贝

简单的说深拷贝就是当遇到值的是对象类型时， 再进行复制一次，

可以用lodash _.cloneDeep() ， jQuery 中的 .clone()/.extend()

当然也可以自己用递归实现在一个方法

function deepClone (ob2) {
    var res ;
    //引用类型分数组和对象分别递归
    if(Object.prototype.toString.call(ob2) == '[object Array]'){
        res = [];
        for(var i =0; i<= ob2.length; i++){
            res[i] = deepClone(ob2[i])
        }
    }else if(Object.prototype.toString.call(ob2) == '[object Object]'){
        res = {}
        for(let j in ob2){
           res[j] = deepClone(ob2[j])
        }
    }else {
        return ob2
    }
    // 值类型直接返回
    return res;
}