코어 자바스크립트 (참조에 의한 객체 복사)

Vorhandenheit ·2021년 6월 16일
0

JS.코어

목록 보기
4/29
post-custom-banner

참조에 의한 객체 복사

객체와 원시 타입의 근본적 차이 중 하나는 객체는 '참조에 의해' 저장되고 복사됨

객체의 동작방식은 변수에 객체가 그대로 저장되는게 아니라, 객체가 저장되어있는 '메모리 주소'인 객체에 대한 '참조 값'이 저장

참조에 의한 비교

객체 비교 시 동등 연산자 ==와 일치 연산자 ===는 동일하게 작동
obj1 >obj2 같은 대소 비교나 obj ==5 같은 원시값과 비교에선 객체가 원시형으로 변환

객체 복사, 병합과 Object.assing

복제가 필요한 상황이라면 새로운 객체를 만든 다음 기존 객체의 프로퍼티들을 순회해 원시 수준까지 프로퍼티를 복사하면 됨

let user = {
	name: "John",
    age: 30
}

let clone = {};

for (let key in user) {
	clone[key] = user[key]
}

objcet.assing을 이용하는 방법

Object.assing(dest, [src1, src2, src3...])
  • dest : 목표로 하는 객체
  • src1....srcN : 복사하고자 하는 객체
  • 객체 src1,...,srcN의 프로퍼티를 dest에 복사, dest를 제외한 인수의 프로퍼티 전부가 첫번째 인수로 복사
  • 마지막 dest 반환

assing 메서드를 사용해 여러 객체를 하나로 병합

let user = {name: John"};
let permissions1 = {canView: true};
let permissions2 = {canEdit: true};
Object.assign(user, permissions1, permission2);
//now user = {name: 'John', canView: true, canEdit: true}

Object.assign을 이용하면 반복문 없이도 간단하게 객체를 복사할 수 있음

let user = {
	name = "John",
  	age = 30
};
let clone = Object.assing({}, users);

모든 프로퍼티가 빈배열에 복사되고 변수에 할당

중첩 객체 복사

프로퍼티가 다른 객체에 대한 참조값일 경우

let user = {
	name: 'john',
  	size: {
    	height: 182,
      	width: 50
    }
}

clone.sizes = user.sizes로 프로퍼티를 복사하는 것만으로 객체를 복제할 수 없음
user.sizes는 객체이기 떄문에 참조 값이 복사
이 문제르 해결하려면 user[key] 각 값을 검사하면서, 값이 객체인 경우 객체의 구조도 복사해주는 반복문을 사용해야함
이를 '깊은 복사(deep clonning)'이라고 함

let user = {
	name: "John",
  	sizes: {
    	height: 182,
      	width: 50
    }
};
let clone = Object.assign({}, user);
alert(user.sizes === clone.sizes);
user.sizes.width++ // 한객체에서 프로퍼티를 변경
alert(clone.sizes.width);
profile
읽고 기록하고 고민하고 사용하고 개발하자!
post-custom-banner

0개의 댓글