js 实现深拷贝

一般不会深拷贝函数等，所以一般用递归和JSON方法即可。

如果要实现函数等拷贝，比较完美的做法：

function deepClone(data) {

  const type = this.judgeType(data);

  let obj;

  if (type === 'array') {

obj = [];

  } else if (type === 'object') {

obj = {};

  } else {

// 不再具有下一层次

return data;

  }

  if (type === 'array') {

// eslint-disable-next-line

for (let i = 0, len = data.length; i < len; i++) {

  obj.push(this.deepClone(data[i]));

}

  } else if (type === 'object') {

// 对原型上的方法也拷贝了....

// eslint-disable-next-line

for (const key in data) {

  obj[key] = this.deepClone(data[key]);

}

  }

  return obj;

},

function  judgeType(obj) {

// tostring会返回对应不同的标签的构造函数

  const toString = Object.prototype.toString;

  const map = {

'[object Boolean]': 'boolean',

'[object Number]': 'number',

'[object String]': 'string',

'[object Function]': 'function',

'[object Array]': 'array',

'[object Date]': 'date',

'[object RegExp]': 'regExp',

'[object Undefined]': 'undefined',

'[object Null]': 'null',

'[object Object]': 'object',

  };

  if (obj instanceof Element) {

return 'element';

  }

  return map[toString.call(obj)];

}

递归：

// 递归的方法实现深拷贝,实际是深入到对象内层不为对象的属性值,然后一个接一个地开辟新的内存地址.

var json1={"name":"鹏哥","age":18,"arr1":[1,2,3,4,5],"string":'afasfsafa',"arr2":[1,2,3,4,5],"arr3":[{"name1":"李鹏"},{"job":"前端开发"}]};

var json2={};

function copy(obj1,obj2){

var obj2 = obj2 || {}; // 最初的时候给它一个初始值等于它自己或者是一个json

for (var name in obj1) {

if (typeof obj1[name] ===  'object') {  // 先判断一下obj1[name]是不是一个对象

obj2[name] = (obj1[name].constructor === Array)? [] : {}, // 区分对象或者数组

copy(obj1[name],obj2[name]) // 调用自身

} else {

obj2[name] = obj1[name] // 如果不是对象,直接等于即可,不会发生引用

}

}

return obj2; // 然后再把复制好的对象给return出去

}

json2 = copy(json1,json2)

json2.arr1.push(24)

console.log(json1)

console.log(json2)

JSON:

// JSON.parse和JSON.stringify也可以实现深拷贝,但是有一定的限制.对于函数或者内置方法或者构造函数等会出现问题

var a = {

a:{

i:1,

k:[1,2,3]

},

b:[{a:123}]

}

function deepCopy(initalObject){

var finalObject = {}

finalObject = JSON.parse(JSON.stringify(initalObject))

return finalObject

}

var b = deepCopy(a);

b.a.k[0]= 33

b.b[0]['a'] = 321123

console.log(a)

console.log(b)

参考链接：

https://www.jianshu.com/p/0d7bd31ccf43    js中对象的复制，浅复制（浅拷贝）和深复制（深拷贝）

https://www.jianshu.com/p/b084dfaad501  关于JSON.parse(JSON.stringify(obj))实现深拷贝应该注意的坑