JavaScript Primer 객체 # 깊이 복사 예 이해

JavaScript Primer 첫 번째 부분: 기본 문법인'대상'의 깊이 복사(deep copy)가 무엇을 하는지 이해할 수 없습니다.공부하면서 그렇게 어색한 점은 아니었겠지만 이해가 안 돼서 기분이 안 좋아서 정리를 했습니다.
다음은 JS Primer의 설명을 참조하십시오.
반대로 귀속 복사와 복사 속성 값은 깊이 복사라고 부른다.deepcopy는 shallowcopy로 귀속할 수 있습니다.다음 코드는 shallowClone을 사용하여 deepClone을 구현합니다.
따라서 자바스크립트 내장 방법은 일반적으로 얕은 (shallow) 실현만 제공하고 깊은 (deep) 실현은 제공하지 않는다.이것은 언어가 최소한의 기능을 제공했고 더욱 복잡한 기능은 사용자 측에서 실현된 형식이기 때문이다.

// 引数の`obj`を浅く複製したオブジェクトを返す
const shallowClone = (obj) => { //(5)
    return Object.assign({}, obj);
};
// (3)
// 引数の`obj`を深く複製したオブジェクトを返す
function deepClone(obj) {
    //(4)
    const newObj = shallowClone(obj); // => {level: 1, nest: {level: 2}}
    // プロパティがオブジェクト型であるなら、再帰的に複製する
    // (6)
    Object.keys(newObj) //引数内のオブジェクトのキー（左側）を一つずつ抜き出してくる（forEachに似てる？）
        .filter(k => typeof newObj[k] === "object") // (7)
        .forEach(k => newObj[k] = deepClone(newObj[k])); // (8)
    return newObj;
}
//(1)
const obj = { 
    level: 1,
    nest: {
        level: 2
    }
};
//(2)
const cloneObj = deepClone(obj);
// (9)`nest`オブジェクトも再帰的に複製されている
console.log(cloneObj.nest === obj.nest); // => false

다음은 실제 절차와 동작이 다르다고 생각하지만 초보자의 이해를 위해 절차를 정리해 본다.

대상은obj변수

에 대입된다

obj 변수를 매개 변수에 전달하는 deepClone 함수를 cloneObj 변수에 대입합니다.

2.에서 기술한 장면은 다음과 같은 절차를 이용하여 명세표를 작성하여 개념 디자인에서 체량의 부피를 분석하도록 한다.

shallowClone# 객체 복사을 호출하여obj를 매개 변수에 전달하고 newObj를 대입합니다.(함수 표현식은 변수 이름으로 참조할 수 있음)

shallowClone 함수 표현식의 무명 함수를 실행합니다.Object.assign 방법으로 obj를 첫 번째 매개 변수에서 대상{}으로 통합하고 되돌려줍니다.

Object.keys에서 임시 매개 변수 내의 객체 (newObj) 키를 하나씩 확장합니다.

함수 표현식에서 변수에 대한 함수로 newObj의 키를 하나하나 검사하고 해당하는 속성으로만 새로운 그룹을 만들고 되돌려줍니다.(→if문처럼!)키의 데이터 형식이 "object"("예?"인지 확인하는 내용입니다.이렇게 생각하는 입문자는 아래 그림 1)을 참조한다.즉, 정렬만 가능합니다{level: 2}.

매개 속성에 대한 매개 변수의 무명 함수를 실행하는 forEach를 설정합니다.deepClone 함수 (저) 를 실행하고 결과를 newObj 대상의 키 k 의 속성에 대입합니다.{level: 2}에 대해 다시 x-y 처리를 진행한다.newObj로 돌아갑니다.

은 원본 obj의 키nest와 복제된 clone Obj의 키nest를 비교하여false가 되기 때문에 복제의 대상임을 알 수 있다.

그림 1:
Array.filter
여기서 마치겠습니다.
그나저나 구가의 복사라면 프로그램의 코드라도 Clone이 아니라 복사였으면 좋겠다고 생각하는 건 나뿐인가.