JavaScript浅拷贝与深拷贝

javaScript的浅拷贝与深拷贝

存储类型

在内存中存储数据分为两种类型：

基本类型：undefind、null、Boolean、String、Number、Symbol

基本类型的数据存放栈内存中（会开辟一块内存空间存放数据）。拷贝会新开辟一块内存空间，将内容

引用类型：Object、Array、Date、Function、EegExp

引用类型的数据存放在堆内存中，存储了值的指针（指针：值在栈内存中的存放地址）。

比较方式

基本类型：比较的是两个数据的值是否相同。

const x = 'abc'
const y = 'abc'
console.log(x === y) // true

引用类型：比较的是两个数据的引用是否相同。

const x = [1, 2, 3]
const y = [1, 2, 3]
console.log(x === y) // false

拷贝方式

浅拷贝：只拷贝一层，引用类型只拷贝了引用。

const obj = {name: 'xiaoming', age: [18, 24]}
function copy(obj) {
   let temp = {}
   for (let key in obj) {
      temp[key] = obj[key]
   }
    return temp
}
let obj2 = copy(obj)
obj2.age[0] = 20
console.log('打印', obj)
// {name:'xiaoming', age: [20, 24]}
console.log('打印', obj2)
// {name:'xiaoming', age: [20, 24]}
// 浅拷贝只拷贝了obj.age的引用，改变了obj2.age的值，obj.age也会随之改变。

浅拷贝可以使用Object.assign方法来代替上面的代码效果是一样的。 数组浅拷贝方法有concat、slice

深拷贝：拷贝会递归遍历引用类型数据，取出其中的值存放到新对象中。不同对象，相同的值互不影响。

一个简单的深拷贝方法：

const obj = {name: 'xiaoming', age: [18, 24]}
const obj2 = JSON.parse(JSON.stringify(obj))
obj2.age[0] = 20
console.log('打印', obj)
// {name: 'xiaoming', age [18, 24]}
console.log('打印', obj2)
// {name: 'xiaoming', age [20, 24]}
// 深拷贝会拷贝所有元素的基本类型，因此改变obj2，obj不会改变。