javascript实现数组或对象的深拷贝

Fundebug 发布于2019-08-23 15:35 / 2116人阅读

摘要：实现深拷贝有两种方法第一简单粗暴可以看出来，改变原数组，并没有对新数组产生影响改变新数组也没有对原数组产生影响第二面试官大多数会问这种方法判断是数组还是对象判断是值类型还是引用类型引用类型的话进行递归操作值类型直接赋值同样改变原数组，并没有

js实现深拷贝有两种方法

第一（简单粗暴）：

let arr = [1, {a: 2}];
let copyArr = JSON.parse( JSON.stringify(arr) );
console.log(copyArr )  // [1, {a: 2}]
arr[1].a = 3;
console.log(copyArr )  // [1, {a: 2}]
copyArr[1].a = 5;
console.log(arr)       // [1, {a: 2}]

可以看出来，改变原数组arr，并没有对新数组copyArr产生影响；改变新数组copyArr也没有对原数组arr产生影响；

第二（面试官大多数会问这种方法）：

let arr = [1, {a: 2}];

function deepCopy(arr) {
    let copyArr = (arr.constructor === Array) ? [] : {}; // 判断是数组还是对象
    for(let i in arr) {
        if(typeof arr[i] === "object") {   // 判断是值类型还是引用类型
            copyArr[i] = deepCopy(arr[i]);  // 引用类型的话进行递归操作
        } else {
            copyArr[i] = arr[i];  // 值类型直接赋值
        }
    }
    return copyArr;
}

let copyArr = deepCopy(arr);
console.log(copyArr )  // [1, {a: 2}]
arr[1].a = 3;
console.log(copyArr )  // [1, {a: 2}]
copyArr[1].a = 5;
console.log(arr)       // [1, {a: 2}]

同样：改变原数组arr，并没有对新数组copyArr产生影响；改变新数组copyArr也没有对原数组arr产生影响；

云服务器 GPU云服务器 javascript对象数组数组拷贝拷贝数组 javascript或

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/102288.html

javascript对象的浅拷贝、深拷贝和Object.assign方法浅析

摘要：对象的浅拷贝浅拷贝是对象共用一个内存地址，对象的变化相互影响。这是特别值得注意的地方。和能正确处理的对象只有等能够被表示的数据结构，因此函数这种不能被表示的类型将不能被正确处理。对象的浅拷贝：浅拷贝是对象共用一个内存地址，对象的变化相互影响。比如常见的赋值引用就是浅拷贝: let srcObj = {name: lilei, age: 20}; let copyObj = srcO...

lixiang 2019-08-22 15:55 评论0 收藏0
低门槛彻底理解JavaScript中的深拷贝和浅拷贝

摘要：案例中的赋值就是典型的浅拷贝，并且深拷贝与浅拷贝的概念只存在于引用类型。修改修改经测试，也只能实现一维对象的深拷贝。经过验证，我们发现提供的自有方法并不能彻底解决的深拷贝问题。在说深拷贝与浅拷贝前，我们先看两个简单的案例： //案例1 var num1 = 1, num2 = num1; console.log(num1) //1 console.log(num2) //1 num...

wind3110991 2019-08-22 16:02 评论0 收藏0
javascript的深拷贝方法总结（主要针对数组和对象进行整理）

摘要：回顾一下我们总结的常用的深拷贝完整方案实现一个函数，可以对中的种主要的数据类型包括进行值复制对数组深拷贝的简单方法总结循环实现数组的深拷贝只适应单层数组结构方法实现数组的深拷贝只适应单层数组结构方法实现数组的深拷贝只适应单层数组结构扩展回顾一下我们总结的常用的深拷贝完整方案实现一个函数clone，可以对JavaScript中的5种主要的数据类型（包括Number、String、Ob...

church 2019-08-21 17:47 评论0 收藏0
JS 中的深拷贝与浅拷贝

摘要：什么是深拷贝浅拷贝见名知义，无论是深拷贝还是浅拷贝，都是的问题。使用如下以上就是关于中的深拷贝与浅拷贝的知识和如何进行深拷贝的知识了，如果有错或者有其他方式的话，欢迎在下面留言评论啦前言最近在写项目的时候涉及到一些父子组件传递个对象或者数组通信啥的，或者是直接复制添加对象啥的，直接使用赋值的时候总会出错。一查原来是浅拷贝的问题，就从网上找了点资料，汇总到这里来了。 1 什么是深拷贝...

ztyzz 2019-08-23 13:41 评论0 收藏0
javascript的深拷贝VS浅拷贝

摘要：深拷贝浅拷贝本文主要对深拷贝浅拷贝的解释及实现做一下简单记录。之所以会有深拷贝与浅拷贝之分，是因为不同数据类型的数据在内存中的存储区域不一样。但注意，只能做一层属性的浅拷贝。深拷贝VS浅拷贝本文主要对深拷贝&浅拷贝的解释及实现做一下简单记录。原文链接，欢迎star。之所以会有深拷贝与浅拷贝之分，是因为不同数据类型的数据在内存中的存储区域不一样。堆和栈是计算机中划分出来用来存储的...

Nekron 2019-08-23 15:08 评论0 收藏0