딥 카피란?무엇이 얕은 복사입니까?

2293 단어
1: 데이터 유형에 따라 데이터 복사
1. 기본 데이터 유형:
복제 후 새로운 데이터가 생성되므로 복제된 데이터가 원래 데이터에 영향을 미치지 않음
2. 참조 데이터 유형:
복제된 데이터는 새로운 데이터를 생성하지 않으며, 복제된 데이터를 수정하면 원래 데이터에 영향을 미칩니다.
참고: 복제본 이후의 데이터를 수정하면 원래 데이터가 얕은 복제본이라고 하며, 복제본 이후의 데이터는 원래 데이터에 영향을 주지 않습니다(일명 딥 클로닝이라고도 함).
2: 데이터 복제 방법
복제 데이터는 주로 배열과 대상 두 가지를 대상으로 한다.
1、"="를 사용하여 변수에 직접 값을 부여
대상/수조를 변수에 직접 값을 부여할 때 복제하는 것은 대상/수조의 주소 값이다. 이들이 가리키는 것은 모두 같은 주소 값이기 때문에 값을 부여한 후에 복사한 데이터를 수정하면 원 데이터에 영향을 줄 수 있다(얕은 복사)
2、Object.assign(newObj,obj)
assign을 사용하여 데이터를 복사합니다. 그 밑바닥은interator를 통해 옮겨다니며, 대상/수조에 대상/수조가 있을 때, 그 값을 부여하는 것은 주소 값이기 때문에 얕게 복사합니다.
3、Array.prototype.concat()//let newArr = arr.concat()
동리 assign
4、Array.prototype.slice() //let newArr = arr.slice()
동리 assign
5、let newObj = JSON.parse(JSON.stringify(obj))
JSON을 사용하기 때문에.stringify()는 객체/배열을 문자열로 만들어 JSON을 사용합니다.parse()가 변환된 후 변환된 것은 기본 유형이기 때문에 변환 후 데이터를 수정하면 원 데이터에 영향을 주지 않기 때문에 깊이 복사(깊이 복제)라고 부른다.
본인의 테스트를 거친 후 다음과 같은 결론을 정리합니다.
assign,concat,slice를 사용할 때 수조/대상의 요소가 모두 기본 유형(수조/대상 포함하지 않음)이라면 그들이 데이터를 복사할 때 기본 유형을 반복하는 방식으로 새로운 수조/대상에게 복사하고 새로운 수조/대상의 데이터를 수정하면 원 데이터(심도 복사)에 영향을 주지 않는다.
복사된 그룹/대상에 그룹/대상이 있을 때, 두루 돌아다닐 때, 대상/그룹 요소의 주소 값을 부여하기 때문에 새로운 그룹/대상의 데이터를 수정하면 원 데이터에 영향을 줄 수 있습니다 (얕은 복사)
[concat, slice, assign을 사용하여 데이터 복사 약술:]
수정된 복사된 수조/대상 중의 데이터는 수조/대상을 포함하지 않고 깊은 복사입니다.
수정된 복사된 그룹/대상의 데이터는 그룹/대상을 포함하고 얕은 복사입니다.
3. 얕은 복사는 원 데이터에 영향을 미치기 때문에 안전하지 않다. 그러면 얕은 복사의 위험을 어떻게 해결해야 하는가??
// 
function checkType(target){
    let type = Object.prototype.toString.call(target).slice(8,-)
    if(type === 'Null'){
        return Null
    }else if(type === 'Undefined'){
        return Undefinde
    }else{
        return type
    }
}

// 
function deepClone(target){
    let reuslt,type = checkType(target)
    if(type === 'Array'){
        type = []
    }else if(type === 'Object'){
        type = {}
    }else{
        return target
    }

    for(key in target){
        let value = target[key]
        if(checkType(value) === 'Array' || checkType(value) === 'Object'){
            result[key] = deepClone(value)
        }else{
            result[key] = value
        }
    }
    return result
}

좋은 웹페이지 즐겨찾기