浅拷贝（Shallow Copy）｜ 深拷贝（Deep Copy）

想要理解深浅拷贝之间的区别，需要了解一下几个概念：第一层属性；嵌套对象；引用类型；

第一层属性(Top-Level properties)： 对象直接包含的属性，不包括嵌套在里面的object或者array；

const obj = {
    name: "Alice",   // 第一层属性（基本类型）
    age: 25,         // 第一层属性（基本类型）
    address: {       // 第一层属性，但它的值是一个嵌套对象
        city: "New York"
    }
};

嵌套对象(Nested Object)： 是指作为另一个对象的属性值的对象，简单来说就是，被套在另一个object中的object；

const obj = {
    name: "Alice",   
    age: 25,         
    address: {       // Nested Object
        city: "New York"
    }
};

这里可以提一下关于如何访问Nested Object的方式，两种：

  • const city = object.address.city;
  • const city = object [“address”] [“city”]

引用类型(Reference Type) 在JS中的值分为两类： - 基本类型（Primitive Type）：直接存储值 - Number、String、Boolean、null、undefined、Symbol、BigInt - 赋值时会复制值本身（即使赋值后改变，新变量和原变量不会互相影响） - 引用类型（Reference Type）：存储的是地址 - Object、Array、Function - 赋值时复制的是地址（reference） - 多个变量会共享同一个对象的引用，修改其中一个会影响另一个

let a = { value: 10 };  // a 存储的是 { value: 10 } 的地址
let b = a;  // b 复制了 a 的地址，而不是对象本身

b.value = 20;  // 修改 b.value 也会影响 a.value

console.log(a.value);  // 20
console.log(b.value);  // 20

因此得出结论：

何为浅拷贝？ —— 赋值的过程中只copy了第一层属性，但是嵌套在其中的object是引用；因此在这种情况下，不推荐对赋值对象进行操作。

何为深拷贝？ —— 递归复制所有层级，嵌套对象也是全新的副本，不共享引用。

在日常开发中，有哪些深拷贝的方式？

JSON.parse | JSON.stringify

举例：const obj2 = JSON.parse( JSON.stringify ( obj1 ) )

这是一个将object序列化和反序列化的过程，首先stringify方法会递归的转化对象，将其转换为字符串；parse方法可以将字符串转换成object格式，从而实现不共享原对象的引用。

该方法不能处理的类型：undefined, Function, Symbol, RegExp, Date, Circular References.

JS内置深拷贝方法

举例： const deepCopy = structuredClone(obj1)

浏览器原生API, 可处理循环引用。