了解js的浅拷贝、深拷贝之前我们必须要了解js的数据类型以及他们在内存中的储存方式
1：基础类型
string、number、null、undefind、symbol
基础类型的值是直接存在堆当中，传的是值
2:引用类型
object
引用类型的值分两步份、一份是值得地址存在堆当中、另外一部分值是存在栈当中
3：赋值
1 var obj = { 2 name:"小刘",//str 类型 3 age:1,//number 类型 4 language:undefined,//undefined 类型 5 weight:null,//null 类型 6 hobby:[‘学习‘],// object 类型（数组） 7 study:{ //object 类型 8 math:89, 9 english:98 10 } 11 } 12 var obj1 = obj 13 obj1.name = "小华" 14 obj1.hobby[0] = ‘打游戏‘ 15 obj1.weight = ‘90‘ 16 console.log(obj) 17 // { 18 // name: ‘小华‘, 19 // age: 1, 20 // language: undefined, 21 // weight: ‘90‘, 22 // hobby: [ ‘打游戏‘ ], 23 // study: { math: 89, english: 98 } 24 // } 25 console.log(obj1) 26 // { 27 // name: ‘小华‘, 28 // age: 1, 29 // language: undefined, 30 // weight: ‘90‘, 31 // hobby: [ ‘打游戏‘ ], 32 // study: { math: 89, english: 98 } 33 // }
obj、obj1 一毛一样
4：浅拷贝
var obj = { name:"小刘",//str 类型 age:1,//number 类型 language:undefined,//undefined 类型 weight:null,//null 类型 hobby:[‘学习‘],// object 类型（数组） study:{ //object 类型 math:89, english:98 } } function copy(obj){ var newObj = {} for(var key in obj){ if(obj.hasOwnProperty(key)){//遍历自身属性、忽略继承属性 newObj[key] = obj[key] } } return newObj } var obj1 = copy(obj) obj1.name = "小华" obj1.hobby[0] = ‘打游戏‘ obj1.weight = ‘90‘ console.log(obj) // { // name: ‘小刘‘, // age: 1, // language: undefined, // weight: null, // hobby: [ ‘打游戏‘ ], // study: { math: 89, english: 98 } // } console.log(obj1) // { // name: ‘小华‘, // age: 1, // language: undefined, // weight: ‘90‘, // hobby: [ ‘打游戏‘ ], // study: { math: 89, english: 98 } // }
从上面我们可以看到obj里面得name这个数据类型是基础类型得值改变了，但是hobby这个引用类型两者都变化了。
如果我们想要做到引用类型也做到完全复制，就要使用深拷贝了。
4：深拷贝
1 var obj = { 2 name:"小刘",//str 类型 3 age:1,//number 类型 4 language:undefined,//undefined 类型 5 weight:null,//null 类型 6 hobby:[‘学习‘],// object 类型（数组） 7 study:{ //object 类型 8 math:89, 9 english:98 10 } 11 } 12 function deepCopy(obj){ 13 return JSON.parse(JSON.stringify(obj)) 14 } 15 var obj1 = deepCopy(obj) 16 obj1.name = "小华" 17 obj1.hobby[0] = ‘打游戏‘ 18 obj1.weight = ‘90‘ 19 console.log(obj) 20 // { 21 // name: ‘小刘‘, 22 // age: 1, 23 // language: undefined, 24 // weight: null, 25 // hobby: [ ‘学习‘ ], 26 // study: { math: 89, english: 98 } 27 // } 28 console.log(obj1) 29 // { 30 // name: ‘小华‘, 31 // age: 1, 32 // weight: ‘90‘, 33 // hobby: [ ‘打游戏‘ ], 34 // study: { math: 89, english: 98 } 35 // }