美文网首页
javascript 数组以及对象的深拷贝

javascript 数组以及对象的深拷贝

作者: meng_281e | 来源:发表于2018-07-20 15:46 被阅读0次

    ES6扩展运算符实现数组的深拷贝

    var arr = [1,2,3,4,5]
    var  copyarr =[ ...arr ]
    copyarr[2] = 5
    console.log(arr)
    console.log(copyarr )
    
    concat 方法实现数组的深拷贝

    它是用于连接多个数组组成一个新的数组的方法。

    var arr = [1,2,3,4,5]
    var arr2 = arr.concat()
    arr[2] = 5
    console.log(arr)
    console.log(arr2)
    
    slice 方法实现数组的深拷贝

    这个代码实现非常简单。原理也比较好理解,他是将原数组中抽离部分出来形成一个新数组。我们只要设置为抽离全部,即可完成数组的深拷贝。代码如下:

    var arr = [1,2,3,4,5]
    var arr2 = arr.slice(0)
    arr[2] = 5
    console.log(arr)
    console.log(arr2)
    
    for 循环实现数组的深拷贝
    var arr = [1,2,3,4,5]
    var arr2 = copyArr(arr)
    function copyArr(arr) {
        let res = []
        for (let i = 0; i < arr.length; i++) {
         res.push(arr[i])
        }
        return res
    }
    

    对象的深拷贝

    转换成json再转换成对象实现对象的深拷贝

    var obj = {
      name: 'FungLeo',
      sex: 'man',
      old: '18'
    }
    var obj2 = JSON.parse(JSON.stringify(obj))
    
    万能的for循环实现对象的深拷贝
    var obj = {
      name: 'FungLeo',
      sex: 'man',
      old: '18'
    }
    var obj2 = copyObj(obj)
    function copyObj(obj) {
      let res = {}
      for (var key in obj) {
        res[key] = obj[key]
      }
      return res
    }
    

    扩展运算符实现对象的深拷贝

    var obj = {
      name: 'FungLeo',
      sex: 'man',
      old: '18'
    }
    var copyobj  ={...obj }
    copyobj .old = '22'
    console.log(obj)
    console.log(copyobj  )
    

    相关文章

      网友评论

          本文标题:javascript 数组以及对象的深拷贝

          本文链接:https://www.haomeiwen.com/subject/bkqqmftx.html