[TIL] Symbol

📚 모던 자바스크립트 deep dive 교재를 참고하여 작성합니다

Symbol

자바스크립트에는 7가지의 원시 타입이 있습니다.
String, Number, Boolean, undefined, null, object, Symbol
앞의 여섯 가지 타입은 많이 접하고 사용을 했지만 Symbol에 대해서 잘 알지 못 하여 관련된 내용을 정리합니다.

Symbol은 ES6에서 도입된 7번째 데이터 타입으로 변경 불가능한 원시 타입의 값입니다. 심벌 값은 다른 값과 중복되지 않는 유일무이한 값입니다. 따라서 주로 이름의 충돌 위험이 없는 유일한 프로퍼티 키를 만들기 위해 사용합니다.

생성

심벌 값은 Symbol 함수를 호출하여 생성합니다. 다른 원시값들은 리터럴 표기법을 사용하여 값을 생성할 수 있지만 심벌 값은 불가능합니다. 생성된 심벌 값은 외부로 노출되지 않아 확인할 수 없으며, 다른 값과 절대 중복되지 않는 유일무이한 값입니다.

const mySymbol = Symbol();

console.log(typeof mySymbol); // symbol

// 외부로 노출되지 않아 확인할 수 없음
console.log(mySymbol); // Symbol()

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

// 심벌 값에 대한 설명이 같더라도 유일무이한 값을 가짐
console.log(mySymbol1 === mySymbol2); // false

심벌 값은 암묵적으로 문자열이나 숫자 타입으로 변환되지 않지만, 불리언 타입으로는 타입이 변환됩니다.

const mySymbol = Symbol();

console.log(mySymbol + ''); // TypeError
console.log(+mySymbol); // TypeError
console.log(!!mySymbol); // true

Symbol.for

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

// 전역 심벌 레지스트리에 abc라는 키로 저장된 심벌 값이 없으면 새로 생성
const s1 = Symbol.for('abc');
// 전역 심벌 레지스트리에 abc라는 키로 저장된 심벌 값이 있으면 반환
const s2 = Symbol.for('abc');

console.log(s1 === s2); // true

Symbol.keyFor

Symbol.keyFor 메서드를 사용하면 전역 심벌 레지스트리에 저장된 심벌 값을 추출할 수 있습니다.

const s1 = Symbol.for('abc');

console.log(Symbol.keyFor(s1)); // abc

// Symbol 함수를 호출하여 생성한 심벌 값은 전역 심벌 레지스트리로 관리되지 않음
const s2 = Symbol('def');

console.log(Symbol.keyFor(s2)); // undefined

Symbol의 쓰임

const Direction = {
  UP: 1,
  DOWN: 2,
  RIGHT: 3,
  LEFT: 4
}

위 코드의 객체 같은 경우에 값에는 특별한 의미가 없고 상수 이름 자체에 의미가 있습니다. 이런 경우에 문제는 상수 값이 변경될 수 있으며, 다른 값과 중복될 수가 있습니다. 이럴 때 무의미한 상수 대신 심벌 값을 사용할 수 있습니다.

const Direction = {
  UP: Symbol('up'),
  DOWN: Symbol('down'),
  RIGHT: Symbol('right'),
  LEFT: Symbol('left')
}