Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |
Tags
- 1일 1로그 100일 완성 IT지식
- HDD와 SSD의 차이
- 네트워크해킹
- 트위터해킹
- 브라우저 작동원리
- 비전공자개발정리
- 공개API
- 데이터분석
- ECMA설명
- ES5
- 숫자구하기
- API요청
- 주식스팸
- 자바스크립트표준
- 프로세서 속도와 심장 박동수
- 아마존해킹
- 컴퓨터과학
- 알고리즘 문제 풀이
- es6문법
- es3
- es6
- 이진검색
- 줌서비스
- 퀵정렬
- 한국디도스
- 빗썸데이터
- ES차이
- CS스터디
- 컴퓨터 논리와 구조
- 아키네이처
Archives
- Today
- Total
개발일지
객체가 뭔가요오~ 이건 복사되는데 저건 안돼요! 본문
참조에 의한 객체 복사
변수엔 객체가 그대로 저장되는 것이 아니라, 객체가 저장되어있는 '메모리 주소’인 객체에 대한 '참조 값’이 저장됩니다.
객체는 메모리 내 어딘가에 저장되고, 변수 user엔 객체를 '참조’할 수 있는 값이 저장됩니다.
따라서 객체가 할당된 변수를 복사할 땐 객체의 참조 값이 복사되고 객체는 복사되지 않습니다.
예시:
let user = { name: "John" };
let admin = user; // 참조값을 복사함
변수는 두 개이지만 각 변수엔 동일 객체에 대한 참조 값이 저장되죠.

let user = { name: 'John' };
let admin = user;
admin.name = 'Pete'; // 'admin' 참조 값에 의해 변경됨
alert(user.name); // 'Pete'가 출력됨. 'user' 참조 값을 이용해 변경사항을 확인함
객체를 서랍장에 비유하면 변수는 서랍장을 열 수 있는 열쇠라고 할 수 있습니다. 서랍장은 하나, 서랍장을 열 수 있는 열쇠는 두 개인데, 그중 하나(admin)를 사용해 서랍장을 열어 정돈한 후, 또 다른 열쇠로 서랍장을 열면 정돈된 내용을 볼 수 있습니다.
참조에 의한 비교
let a = {};
let b = a; // 참조에 의한 복사
alert( a == b ); // true, 두 변수는 같은 객체를 참조합니다.
alert( a === b ); // true
다른 예시를 살펴봅시다. 두 객체 모두 비어있다는 점에서 같아 보이지만, 독립된 객체이기 때문에 일치·동등 비교하면 거짓이 반환됩니다.
객체 복사, 병합과 object.assign
assign 메서드를 사용해 여러 객체를 하나로 병합하는 예시를 살펴봅시다.
let user = { name: "John" };
let permissions1 = { canView: true };
let permissions2 = { canEdit: true };
// permissions1과 permissions2의 프로퍼티를 user로 복사합니다.
Object.assign(user, permissions1, permissions2);
// now user = { name: "John", canView: true, canEdit: true }
목표 객체(user)에 동일한 이름을 가진 프로퍼티가 있는 경우엔 기존 값이 덮어씌워 집니다.
let user = { name: "John" };
Object.assign(user, { name: "Pete" });
alert(user.name); // user = { name: "Pete" }
Object.assign을 사용하면 반복문 없이도 간단하게 객체를 복사할 수 있습니다.
let user = {
name: "John",
age: 30
};
let clone = Object.assign({}, user);
예시를 실행하면 user에 있는 모든 프로퍼티가 빈 배열에 복사되고 변수에 할당됩니다.
객체의 '진짜 복사본’을 만들려면 '얕은 복사(shallow copy)'를 가능하게 해주는 Object.assign이나 '깊은 복사’를 가능하게 해주는 _.cloneDeep(obj)를 사용하면 됩니다. 이때 얕은 복사본은 중첩 객체를 처리하지 못한다는 점을 기억해 두시기 바랍니다.
가장 궁금했던 부분이다 뭐는 복사가 되고 초반에 복사를 하는데 값이 안바뀌고
값을 다른곳에 두고 그 주소를 가져온다는게 이해가 안갔다!
근데 지금은 이해간다! 주소값을 주는거지 값을 주는게 아니다
'책) 코어 자바스크립트' 카테고리의 다른 글
옵셔널 체이닝 '?.'이 필요한 이유?? (0) | 2022.06.21 |
---|---|
메서드와 this~ is method 설명 밑줄 (0) | 2022.06.17 |
가비지 컬렉션??? JS의 휴지통?! (0) | 2022.06.15 |
JS. 객체 간단소개와 궁금했는데 못 찾았던 것들! (0) | 2022.06.13 |
데이터 타입 불변성?? 불변객체 const (0) | 2022.06.11 |
Comments