Symbol, 참조에 의한 객체 복사, Optional Chaining
Symbol
Unique Identifier를 사용하고 싶을 때
// 기본형
let id = Symbol();
// 'id'라는 설명이 붙은 심볼
let id = Symbol('id');
hidden property
// 기본형
let id = Symbol();
// 'id'라는 설명이 붙은 심볼
let id = Symbol('id');
숨김 프로퍼티는 외부 코드에서 접근이 불가능하고 값 덮어쓰기도 불가능
참조에 의한 객체복사
let user = { name: 'John' };
let admin = user; // 참조값을 복사
let user = { name: 'John' };
let admin = user; // 참조값을 복사
객체는 메모리 내 저장되고 변수 user엔 객체를 참조할 수 있는 값이 저장
👉 객체가 할당된 변수를 복사할 땐 객체의 참조 값이 복사되고 객체는 복사되지 않는다
👉 객체에 접근하거나 객체를 조작할 땐 여러 변수를 사용한다
let user = { name: 'Jinju' };
let admin = user;
admin.name = 'Someone'; // 'admin' 참조 값에 의해 변경됨
alert(user.name); // 'Someone'
객체 복사
자바스크립트는 객체 복제 내장 메서드를 지원하지 않고 참조에 의한 복사로 해결 가능한 일이 대다수이지만 정말 복제가 필요한 상황이라면
👉 새로운 객체를 만들고 다음 기존 객체의 프로퍼티들을 순회해 원시 수준까지 프로퍼티를 복사
Optional Chaining '?.'
- 구식 브라우저는 폴리필이 필요
?.
앞의 평가대상이 undefined
나 null
이면 평가를 멈추고 undefined
를 반환
- 옵셔널 체이닝을 남용하지 않는다
let user = {}; // 주소 정보가 없는 사용자
// 옵셔널체이닝이 추가되기 전엔 && 연산자를 사용했음
alert(user && user.address && user.address.street); // undefined, 에러발생X
// 옵셔널체이닝 사용
alert(user?.address?.stress)l // undeined, 에러발생 X
short-circuit (단락 평가)
?.
앞의 평가대상이 undefined
나 null
이면 평가를 멈추고 undefined
를 반환let user = {}; // 주소 정보가 없는 사용자
// 옵셔널체이닝이 추가되기 전엔 && 연산자를 사용했음
alert(user && user.address && user.address.street); // undefined, 에러발생X
// 옵셔널체이닝 사용
alert(user?.address?.stress)l // undeined, 에러발생 X
?.
는 왼쪽 평가대상에 값이 없으면 즉시 평가를 멈춘다
syntax construct (문법 구조체)
?.
는 연산자가 아니라 함수나 대괄호와 함께 동작하는 문법 구조체이다.
// 존재 여부가 확실치 않은 함수를 호출할 때
// 한 객체엔 메서드 admin이 있지만 다른 객체에는 없는 상황
let user1 = {
admin() {
alert('관리자 계정입니다');
}
}
let user2 = {};
user1.admin?.(); // 관리자 계정입니다
user2.admin?.();
user1
에는admin
이 정의되어 있기 때문에 메서드가 제대로 호출user2
에는admin
이 정의되어 있지 않았음에도 불구하고 메서드를 호출하면 에러없이 평가가 멈춤
.
대신 대괄호[]
를 사용해 객체 프로퍼티에 접근하는 경우에는?.[]
사용 가능- 위 예시와 마찬가지로
?.[]
를 사용하면 객체 존재 여부가 확실치 않은 경우에도 안전하게 프로퍼티를 읽을 수 있음
let user1 = {
firstName: 'Pearl'
};
let user2 = null; // user2는 권한이 없는 사용자라고 가정
let key = 'firstName';
alert(user1?.[key]); // Pearl
alert(user2?.[key]); // undefined
alert(user1?.[key]?.something?.not?.existing); // undefined
?.
은 delete
와 조합해 사용가능하다
delete user?.name; // user가 존재하면 user.name을 삭제한다
Optional Chaining 요약
obj?prop
-obj
가 존재 ?obj.prop
을 반환 :undefined
를 반환obj?[prop]
-obj
가 존재 ?obj[prop]
반환 :undefined
를 반환obj?.method()
-obj
가 존재 ?obj.method()
호출 :undefined
를 반환
Author And Source
이 문제에 관하여(Symbol, 참조에 의한 객체 복사, Optional Chaining), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@100pearlcent/Symbol-참조에-의한-객체-복사-Optional-Chaining저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)