深拷贝和浅拷贝

JS有两种数据类型

    基本数据类型 string/number/boolean/undefined/null/symbol(ES6):储存在栈内存中,保存与复制都是数据本身
    引用数据类型 object/array/function:储存在堆内存中,保存与复制都是指向对象的指针

浅拷贝

对于基本数据类型来说,拷贝一份互不影响;而对于数组和对象来说,只会拷贝数组或者对象的引用,对新旧数组进行修改,两个数组都会发生变化。

基础的数组方法能够实现浅拷贝,例如concat()、slice();对象能够使用Object.assign()实现浅拷贝。

 1 如果是嵌套数组和对象,上述方法不可行
 2 let arr = [1, 2, 3, 4], arr1 = [1, 2, 3, [4, 5, 6]]
 3 
 4 let copyarr = arr.slice(), copyarr1 = arr1.slice()
 5 
 6 arr[1] = 5    //arr[1, 5, 3, 4], copyarr[1, 2, 3, 4]  
 7 
 8 arr1[3][1] = 7   //arr1[1, 2, 3, [4, 7, 6]], copyarr1[1, 2, 3, [4, 7, 6]]
 9 
10 let obj = { a: 1, b: 2, c: 3 }, obj1 = { a: 1, b: 2, c: { d: 3, e: 4 } }
11 
12 let copyobj = Object.assign({}, obj), copyobj1 = Object.assign({}, obj1)
13 
14 obj.b = 4   //obj{ a: 1, b: 4, c: 3 }, copyobj{ a: 1, b: 2, c: 3 }
15 
16 obj1.c.d = 6    //obj1{ a: 1, b: 2, c: { d: 6, e: 4 } }, copyobj1{ a: 1, b: 2, c: { d: 6, e: 4 } }

深拷贝
指完全的拷贝一个对象,即使嵌套了对象,两者也相互分离,修改一个对象的属性,也不会影响另一个。

    1.可以使用JSON的两个函数方法实现深拷贝

1 let arr = ['old', 1, true, ['old1', 'old2'], {old: 1}]
2 let new_arr = JSON.parse( JSON.stringify(arr) );
3 arr[3][1] = 'old4'    //new_arr['old', 1, true, ['old1', 'old2'], {old: 1}]

但是缺点就是不能拷贝函数和undefined

   2. 深拷贝函数

 1 function deepClone(obj) {
 2   function isObject(obj) {   //判断是不是对象
 3     return typeof obj !== null && typeof obj === 'object' || typeof obj === 'function'
 4   }
 5 
 6   if (!isObject(obj)) {
 7     return;
 8   }
 9 
10   let newObj = Array.isArray(obj) ? [] : {}    //判断对象类型
11 
12   Object.keys(obj).forEach(key => {
13     newObj[key] = isObject(obj[key]) ? deepClone(obj[key]) : obj[key]   //判断当前值是不是对象
14   })
15 
16   return newObj
17 }

 

posted @ 2020-06-22 16:20  微光半夏星  阅读(172)  评论(0编辑  收藏  举报