实现深拷贝的方法

使用JSON.parse与JSON.stringify实现深拷贝

JSON.parse可以把json字符串转化为对象
JSON.stringify可以把json对象转化为字符串

let obj1={
    name:'daji',
    age:18
}
let str=JSON.stringify(obj1)
let obj2=JSON.parse(str)
obj1.age = 30
console.log(obj2)   //{name:'daji',age:18} age还是18没有改变是深拷贝
封装深拷贝函数

封装针对基本数据类型及数组,对象的深拷贝

//判断数据类型函数
//type of obj/arr 都返回object 无法判断引用数据类型
let CheckType=data=>{ 
    //由于Object.prototype.toString.call(data) 用此方法可以判断是数组还是对象
    //CheckType({})   //[object Object]
    //CheckType([])   //[object Array]
    //因此可以:
    return Object.prototype.toString.call(data).slice(8,-1)  //从下标8开始截取,可以返回Object或者Array
}

//深拷贝函数
let deepClone=target=>{
    let targetType = CheckType(target)  //判断数据类型
    let result   
    if(targetType == 'Object'){
        result={}     //如果是对象返回一个对象类型
    }else if(targetType == 'Array'){
        result=[]     //如果是数组返回一个数组类型
    }else{
        return target   //如果是基本数据类型直接返回原数据
    }
    for(let i in target){     //循环遍历
        let value = target[i]   //取每个属性的值,对象也可以用[]取值,例如let obj={a:1};obj['a']输出1
        let valueType = CheckType(value) //如果传入target是对象,又嵌套了对象,还需要value判断数据类型
        if(valueType === 'Object' || valueType === 'Array'){
            result[i]=deepClone(value)  //递归,如果是对象或数组再进行深拷贝
        }else{
            result=value
        }
    }
    return result  //返回结果
}

测试封装函数,成功

let arr1=[1,2,{age:18}]
let arr2=deepClone(arr1)
arr2.age=30
console.log(arr1);  //arr1中的age还是为18不被改变
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容