js中深浅拷贝的知识，要知道

╰+哭是因爲堅強的太久メ 2023-07-10 14:17 14阅读 0赞

**浅拷贝**

首先可以通过 Object.assign来解决这个问题，很多人认为这个函数是用来深拷贝的。其实并不是，Object.assign 只会拷贝所有的属性值到新的对象中，如果属性值是对象的话，拷贝的是地址，所以并不是深拷贝

let a = { 
      age: 1
    }
    let b = Object.assign({ }, a)
    a.age = 2
    console.log(b.age) // 1

另外我们还可以通过展开运算符 … 来实现浅拷贝

let a = { 
      age: 1
    }
    let b = {  ...a }
    a.age = 2
    console.log(b.age) // 1

通常浅拷贝就能解决大部分问题了，但是当我们遇到如下情况就可能需要使用到深拷贝了

let a = { 
      age: 1,
      jobs: { 
        first: 'FE'
      }
    }
    let b = {  ...a }
    a.jobs.first = 'native'
    console.log(b.jobs.first) // native

浅拷贝只解决了第一层的问题，如果接下去的值中还有对象的话，么就又回到最开始的话题了，两者享有相同的地址。要解决这个问题，我们就得使用深拷贝了。

**深拷贝**

这个问题通常可以通过 JSON.parse(JSON.stringify(object)) 来解决。

let a = { 
      age: 1,
      jobs: { 
        first: 'FE'
      }
    }
    let b = JSON.parse(JSON.stringify(a))
    a.jobs.first = 'native'
    console.log(b.jobs.first) // FE

**但是该方法也是有局限性的**：

*  会忽略 undefined
 *  会忽略 symbol
 *  不能序列化函数
 *  不能解决循环引用的对象

let obj = { 
      a: 1,
      b: { 
        c: 2,
        d: 3,
      },
    }
    obj.c = obj.b
    obj.e = obj.a
    obj.b.c = obj.c
    obj.b.d = obj.b
    obj.b.e = obj.b.c
    let newObj = JSON.parse(JSON.stringify(obj))
    console.log(newObj)

[个人博客地址][Link 1]可以看一看

[Link 1]: https://caoduoya.github.io/

发表评论取消回复

表情：

评论列表（有 0 条评论，14人围观）

还没有评论，来说两句吧...

相关阅读

相关 js中深浅拷贝的知识，要知道

浅拷贝首先可以通过 Object.assign来解决这个问题，很多人认为这个函数是用来深拷贝的。其实并不是，Object.assign 只会拷贝所有的属性值到新的对象中，如

╰+哭是因爲堅強的太久メ/ 2023年07月10日 14:17/ 0 赞/ 15 阅读

相关 JS深浅拷贝

浅拷贝的原理和实现对于浅拷贝的定义我们可以初步理解为： > 自己创建一个新的对象，来接受你要重新复制或引用的对象值。如果对象属性是基本的数据类型，复制的就是基本类型的

╰+攻爆jí腚メ/ 2023年01月10日 14:37/ 0 赞/ 135 阅读

相关 JS深浅拷贝

JS深浅拷贝的基础知识 js实现深浅拷贝的理论基础是，不同的数据类型在内存中存储的方式不同 js数据类型分为：基本数据类型，引用数据类型基本数据类型：`stri

旧城等待，/ 2023年01月08日 05:27/ 0 赞/ 140 阅读

相关 JS 深浅拷贝

JS基本数据类型基础数据类型按值进行访问的，可以操作保存在变量中的实际值引用数据类型，不允许直接访问值，不能直接操作对象的内存空间，在操作对象时，实际操作

￡神魔★判官ぃ/ 2022年12月29日 04:58/ 0 赞/ 230 阅读

相关深浅拷贝

![75ea3c96bae2df730d2326f980d4bf0e.png][] 关于深浅拷贝，我们先要明白的第一点是在js中数据类型分为基本数据类型和引用数据类型，基本数

分手后的思念是犯贱/ 2022年12月08日 05:07/ 0 赞/ 256 阅读

相关 JS深浅克隆(拷贝)原理

深浅克隆(拷贝) 在JS中数据分为栈和堆两种方式存储：基本数据类型保存在栈内存；引用数据类型（对象、数组、函数、正则）保存在堆内存中；堆存

水深无声/ 2022年10月05日 10:53/ 0 赞/ 184 阅读

相关 JS深浅拷贝

对象： let obj = { a:"a", b:"b" } // 以下两种为浅拷贝 let newObj = {

ゝ一世哀愁。/ 2022年10月05日 10:45/ 0 赞/ 237 阅读

相关 JS数组的深浅拷贝

javascript数组在使用时，时常会遇到数组备份的情况，之后对数组做些修改，再同原数组进行比对，查看数组的变化，这里就涉及到一个数组拷贝的问题。浅拷贝只复制一层对象的属

ゝ一纸荒年。/ 2022年06月13日 13:42/ 0 赞/ 230 阅读

相关 Javascript 中的深浅拷贝

> 工作中经常会遇到需要复制 JS 数据的时候，遇到 bug 时实在令人头疼；面试中也经常会被问到如何实现一个数据的深浅拷贝，但是你对其中的原理清晰吗？一起来看一下吧！为

喜欢ヅ旅行/ 2022年04月03日 09:30/ 0 赞/ 265 阅读

相关 js的深浅拷贝

JavaScript的深浅拷贝一直是个难点，如果现在面试官让我写一个深拷贝，我可能也只是能写出个基础版的。所以在写这条之前我拜读了收藏夹里各路大佬写的博文。具体可以看下面...

朱雀/ 2021年04月16日 13:59/ 0 赞/ 533 阅读