javascript 数组以及对象的深拷贝方法

javascript 数组以及对象的深拷贝方法

for循环

var arr = [{
  name: 'jq',
  old: '20'
},{
  name: 'aa',
  old: '18'
}]
var arr2=[]
for(let i=0;i<arr.length;i++){
     arr2.push({...arr[i]})
}
arr[0].name='xiaoming'
console.log(arr)  //[{name: "xiaoming", old: "20"},{name: "aa", old: "18"}]
console.log(arr2) //[{name: "jq", old: "20"},{name: "aa", old: "18"}]

var obj = {
  name: 'jq',
  old: '20'
}
var obj2 = copyObj(obj)
function copyObj(obj) {
  let res = {}
  for (var key in obj) {
    res[key] = obj[key]
  }
  return res
}
obj.name='aa'
console.log(obj) //{name: "aa", age: "20"}
console.log(obj2)//{name: "jq", age: "20"}

arr.concat()返回一个新数组

var arr = [1,2,3,4]
var newarr = arr.concat();
arr2[1]=5;
console.log(arr);   //[1,2,3,4]
console.log(arr2);//[1,5,3,4]

slice 方法 从已有的数组中返回选定的元素。

var arr = [1,2,3,4]
var arr2 = arr.slice(0)
arr[2] = 5
console.log(arr) //[1, 2, 5, 4]
console.log(arr2)// [1, 2, 3, 4]

转换成json字符串再转成json对象

var obj = {
  name: 'jq',
  age: '20'
}
var obj2 = JSON.parse(JSON.stringify(obj))
obj.name='aa'
console.log(obj) //{name: "aa", age: "20"}
console.log(obj2)//{name: "jq", age: "20"}

ES6扩展运算符

var arr = [1,2,3,4]
var [ ...arr2 ] = arr
arr[2] = 5
console.log(arr) //[1, 2, 5, 4]
console.log(arr2)//[1, 2, 3, 4]

var obj = {
  name: 'jq',
  age: '20'
}
var {...obj2}=obj;
obj.name='aa'
console.log(obj) //{name: "aa", age: "20"}
console.log(obj2)//{name: "jq", age: "20"}

Object.assign()

var obj={name:'jq',age:15}
var obj2=Object.assign({},obj)
obj.name='aa'
console.log(obj) //{name: "aa", age: "15"}
console.log(obj2)//{name: "jq", age: "15"}