js深拷贝

186 阅读1分钟

浅拷贝和深拷贝的区别:

浅拷贝: 只是将数据中所有的数据引用下来,依旧指向同一个存放地址,拷贝之后的数据修改之后,也会影响到原数据的中的对象数据

深拷贝: 将数据中所有的数据拷贝下来,对拷贝之后的数据进行修改不会影响到原数据1、使用递归的方式实现深拷贝

JS 中深拷贝的几种实现方法

1 、使用递归的方式实现数组、对象的深拷贝

function deepClone1(obj) {
  //判断拷贝的要进行深拷贝的是数组还是对象,是数组的话进行数组拷贝,对象的话进行对象拷贝
  var objClone = Array.isArray(obj) ? [] : {};
  //进行深拷贝的不能为空,并且是对象或者是
  if (obj && typeof obj === "object") {
    for (key in obj) {
      if (obj.hasOwnProperty(key)) {
        if (obj[key] && typeof obj[key] === "object") {
          objClone[key] = deepClone1(obj[key]);
        } else {
          objClone[key] = obj[key];
        }
      }
    }
  }
  return objClone;
}
---------------------

2、通过 JSON 对象实现深拷贝

//通过js的内置对象JSON来进行数组对象的深拷贝
function deepClone2(obj) {
  var _obj = JSON.stringify(obj),
    objClone = JSON.parse(_obj);
  return objClone;
}
---------------------
b = JSON.parse( JSON.stringify( a ) )
由于JSON.stringify()这个方法是先将文明要拷贝的数据线转换成字符串,来开辟一个新的地址用以储存新的数据,
但是这个方法无法转化 function 和 undefined。

3、通过jQuery的extend方法实现深拷贝

var array = [1,2,3,4]; 
var newArray = $.extend(true,[],array);

4、Object.assign()拷贝

当对象中只有一级属性,没有二级属性的时候,此方法为深拷贝,但是对象中有对象的时候,此方法,在二级属性以后就是浅拷贝。

5、lodash函数库实现深拷贝

lodash很热门的函数库,提供了 lodash.cloneDeep()实现深拷贝