[TIL] #15 (2022.02.07)

okyungjin·2022년 2월 7일
0

TIL

목록 보기
15/15
post-thumbnail

Symbol

Symbol이란?

Symbol 은 ES6에서 도입된 7번째 데이터 타입으로 변경 불가능한 원시 타입의 값이다.

Symbol 값은 다른 값과 중복되지 않는 유일무이한 값이다. 따라서 주로 이름의 충돌 위험이 없는 유일한 프로퍼티 키를 만들기 위해 사용한다.

1997년 자바스크립트가 ECMAScript로 표준화된 이래로 자바스크립트는 6개의 타입이 있었다.
1. 문자열
2. 숫자
3. 불리언
4. undefined
5. null
6. 객체

Symbol 값의 생성

Symbol은 원시 타입이지만 다른 원시 값처럼 리터럴 표기법을 통해 값을 생성할 수는 없고, Symbol 함수를 호출하여 생성한다.

이 때 생성된 심벌 값은 외부로 노출되지 않아 확인할 수 없으며, 다른 값과 절대 중복되지않는 유일무이한 값이다.

const mySymbol = Symbol();
console.log(typeof mySymbol); // symbol
console.log(mySymbol); // Symbol() 값이 외부로 노출되지 않아 확인할 수 없다

생성

생성자 함수로 객체를 생성하는 것처럼 보이지만 Symbol 함수는 String``Number Boolean생성자 함수와 달리 new 연산자와 함께 호출하지 않는다.

new Symbol(); // TypeError: Symbol is not a constructor

문자열을 인수로 전달

Symbol함수에는 optional하게 문자열을 인수로 전달할 수 있다. 이 문자열은 생성된 심벌 값에 대한 설명이며, 디버깅 용도로만 사용되고 심벌 값 생성에 어떠한 영향도 주지 않는다.

const mySymbol1 = Symbol('mySymbol');
const mySymbol2 = Symbol('mySymbol');

console.log(mySymbol1 === mySymbol2); // false

암묵적 래퍼 객체 생성

Symbol 값도 문자열, 숫자, 불리언과 같이 객체처럼 접근하면 암묵적으로 래퍼 객체를 생성한다.

const mySymbol = Symbol('mySymbol');

console.log(mySymbol.description); // mySymbol
console.log(mySymbol.toString()); // Symbol(mySymbol)

description 프로퍼티와 toString() 메서드는 Symbol.protoType의 프로퍼티이다.

불리언 외 다른 타입으로 변환 불가

Symbol 값은 암묵적으로 문자열이나 숫자 타입으로 변환되지 않는다.

const mySymbol = Symbol();

console.log(mySymbol + ''); // TypeError: Cannot convert a Symbol value to a string
console.log(+mySymbol); // TypeError: Cannot convert a Symbol value to a string <- error mesage 확인해보기

단, 불리언 타입으로는 암묵적 타입 변환이 가능하다.

const mySymbol = Symbol();
console.log(!!mySymbol);
if (mySymbol) console.log('mySymbol is not empty.');

Symbol 검색

Symbol.for

Symbol.for 메서드는 인수로 전달받은 문자열을 키로 사용하여 키와 심벌 값의 쌍이 저장되어 있는 전역 심벌 레지스트리에서 해당 키와 일치하는 심벌 값을 계산한다.

  • 검색에 성공 -> 새로운 Symbol 값을 생성하지 않고, 검색된 Synbol 값을 반환
  • 검색에 실패 -> 새로운 Symbol 값을 생성하여 Symbol.for 메서드의 인수로 전달된 키로 global symbol registery에 저장한 후, 생성된 Symbol 값을 반환
// global symbol registery에 `mySymbol` 키로 저장된 심벌 값이 없으면 새로운 Symbol 값 생성
const s1 = Symbol.for('mySymbol');

// global symbol registery에 `mySymbol` 키로 저장된 심벌 값이 있으면, 해당 Symbol을 반환
const s2 = Symbol.for('mySymbol');

console.log(s1 === s2);

Symbol 함수는 호출될 때마다 유일무이한 심벌 값을 생성한다. 이때 global symbol registry에 등록되어 관리되지는 않는다. But Symbol.for메서드를 사용하면 애플리케이션 전역에서 중복되지 않는 유일무이한 상수인 Symbol 값을 단 하나만 생성하여, global symbol registry를 통해 공유할 수 있다.

Symbol.keyFor

Symbol.keyFor 을 사용하면 global symbol registry에 저장된 Symbol 값의 key를 추출할 수 있다.

const s1 = Symbol.for('mySymbol');
Symbol.keyFor(s1); // -> mySymbol

const s2 = Symbol('foo');
Symbol.keyFor(s2); // -> undefined
profile
배우고 기록하는 것을 좋아하는 프론트엔드 개발자입니다 ✌️

0개의 댓글