方法一
思路:根据判断key 来处理
1.先定义一个变量,需看是传出来是数组还是对像,如果是对像则定义为Object,如果是数组则是Array
2.先用for in 循环对像获数组
3.先用hasOwnProperty判断key是否存在
4.如果key存在判断key的类型是引用数据类型(Object)还是基础数据类型
5.是引用数据类型(Object)则递归调用,如果是基础数据类型则直接赋值
function deepClone(source){
const currentObj=source.constructor === Array ? [] : {}
for(let keys in source){
if(source.hasOwnProperty[keys]){
/*
* 对像会有三种情况
* obj={
nam:'111'
age:{id:12,name:'22'},
box:['1',2,3]
}
*/
if(source[key] && typeof source[keys] === Object ){
//currentObj[keys]=source.constructor === Array ? [] : {} //这句可以不用
currentObj[keys]=deepClone(source[keys])
}else{
currentObj[keys]=source[keys]
}
}
}
return currentObj
}
let obj={nam:'111'age:{id:12,name:'22'}, box:['1',2,3] }
let obj2=deepClone(obj)
obj2.name='2222'
console.log(obj,obj2)
方法二
通过序列化和反序列化进行克隆,当消息包含函数、Symbol等不可序列化的值时,就会报无法克隆的DOM异常
function deepClone(obj) {
return new Promise(res => {
const { port1, port2 } = new MessageChannel();
port1.postMessage(obj);
port2.onmessage = msg => {
res(msg.data);
}
})
}
方法三
使用JSON格式转换,无法对循环对象进行克隆
//缺点:无法对循环对象进行克隆
function deepClone(obj){
return JSON.parse(JSON.stringify(obj))
}