深拷贝和浅拷贝
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 }