深拷贝和浅拷贝都只针对引用数据类型
浅拷贝:指 两个js 对象指向同一个内存地址,其中一个改变会影响另一个
深拷贝: 指复制后的新对象重新指向一个新的内存地址,两个对象改变互不影响
1- 数组的拷贝
1-1 简单数据类型
var arr = [1,2,3,4,5]; //原数组
var newArr1 = arr; //浅拷贝
var newArr2 = arr.slice(); //深拷贝
var newArr3 = arr.concat(); //深拷贝
var newArr4 = [...arr]; //深拷贝
var newArr5 = JSON.parse(JSON.stringify(arr)); //深拷贝
arr[0] = 'leon';
arr[1]= '27';
console.log(arr);
console.log(newArr1);
console.log(newArr2);
console.log(newArr3);
console.log(newArr4);
console.log(newArr5);
1-2 复杂数据类型
var arr = [{name: 'wens'},{age: '26'}]; ; //原数组
var newArr1 = arr; //浅拷贝
var newArr2 = arr.slice(); //浅拷贝
var newArr3 = arr.concat(); //浅拷贝
var newArr4 = [...arr]; //浅拷贝
var newArr5 = JSON.parse(JSON.stringify(arr)); //深拷贝
arr[0].name = 'leon';
arr[1].age = '27';
console.log(arr);
console.log(newArr1);
console.log(newArr2);
console.log(newArr3);
console.log(newArr4);
console.log(newArr5);
2- 对象的拷贝
2-1 简单数据类型
var obj = {name:"cheng",age:18}
var a1 = {...obj} // 深拷贝
var a2= Object.assign({},obj) // 深拷贝
var a3 = obj // 浅拷贝
obj.id = 100;
console.log(a1) // {name:"cheng",age:18}
console.log(a2) // {name:"cheng",age:18}
console.log(a3) // {name:"cheng",age:18,id:1001}
2-2 复杂数据类型
// 实现深拷贝
var china = {
nation : '中国',
birthplaces:['北京','上海','广州'],
skincolr :'yellow',
friends:['sk','ls']
}
//深复制,要想达到深复制就需要用递归
function deepCopy(o,c){
var c = c || {}
for(var i in o){
if(typeof o[i] === 'object'){
//要考虑深复制问题了
if(o[i].constructor === Array){
//这是数组
c[i] =[]
}else{
//这是对象
c[i] = {}
}
deepCopy(o[i],c[i])
}else{
c[i] = o[i]
}
}
return c
}
var result = {name:'result'}
result = deepCopy(china,result)
console.dir(result)
var test ={
name:{
xing:{
first:'张',
second:'李'
},
ming:'老头'
},
age :40,
friend :['隔壁老王','宋经纪','同事']
}
var result = JSON.parse(JSON.stringify(test))
result.age = 30
result.name.xing.first = '往'
result.friend.push('fdagldf;ghad')
console.dir(test)
console.dir(result)
遇到复杂类型(array+object)如何实现深拷贝
// 遇到复杂类型(array+object)如何实现深拷贝
// var obj = null
var obj = {name:{name:"cheng"}}
function deepClone(obj){
// 1. 能够识别数组和对象了
let result;
if(obj instanceof Array || obj instanceof Object){
// 2.对拷贝的值做初始值的设定
if(obj instanceof Array){
result = []
}else if(typeof obj == "object"){
result={}
}
// 3.需要将obj克隆到result中
for(let key in obj){
result[key] = deepClone(obj[key])
}
return result
}else{
return obj
}
}
deepClone(obj)
console.log(deepClone(obj))