멀티 크리에이터 NoHack의 개발 로그

심볼(Symbol) 🤔

ES6에서 새로 추가된 원시 타입인 심볼(Symbol)은 변경 불가능 하며, 다른 값과 절대 중복되지 않는 값입니다.

 

심볼은 Symbol()이라는 함수를 사용해서 만들 수 있습니다.

 

const symbol1 = Symbol('Test');
const symbol2 = Symbol('Test');

console.log(symbol1); // Symbol(Test)
console.log(symbol2); // Symbol(Test)
console.log(symbol1 === symbol2); // false

 

심볼은 다른 타입과 달리 리터럴이 아닌, Symbol 함수로 만들 수 있습니다. 언뜻 보면 생성자 함수를 호출해서 객체를 만드는 것처럼 보이지만, 심볼은 변경 불가능한 원시 값이기 때문에 new를 사용해 호출하지 않습니다.

 

심볼은 생성자가 존재하지 않으므로, new를 사용하면 TypeError를 발생 시킵니다.

 

그리고 같은 값을 심볼로 만들어도 그 자체가 각각 고유한 값이 되므로, 비교하면 false를 출력합니다.

 

또한 심볼은 키 자체가 의미를 지니므로 다음과 같은 활용이 가능합니다.

 

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

const myDirection = Direction.UP;
console.log(myDirection);

 

Object.freeze 메소드는 객체를 동결시키는 메소드로, 정의 이후 객체 자체를 변경할 수 없게 만듭니다. 이렇게 함으로써 다른 프로그래밍 언어의 enum과 비슷하게 동작시킬 수 있습니다.

 

심볼 레지스트리 ⭐️

심볼 레지스트리(Symbol Registry)는 심볼의 키와 값이 저장되어 있는 전역 저장소입니다. Symbol.for 메소드로 레지스트리에 키를 등록할 수 있으며, 등록한 이후에는 키를 통해 레지스트리에서 값을 불러올 수 있습니다.

 

const s1 = Symbol.for('NoHack');
const s2 = Symbol.for('NoHack');

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

 

Symbol.for 메소드와 달리 Symbol 함수는 심볼 레지스트리에 키를 등록하지 않습니다.

 

심볼과 프로퍼티 🔥

객체의 프로퍼티 키는 빈 문자열을 포함하는 모든 문자열과 심볼로 만들 수 있습니다. 또한 동적으로 생성할 수도 있는데, 이 경우에는 대괄호([])를 사용해야 합니다. 그리고 심볼을 통해 프로퍼티에 접근하고자 한다면, 동일하게 대괄호를 사용해야 합니다.

 

const obj = {
  [Symbol.for('myKey')]: 123,
};
// 123
console.log(obj[Symbol.for('myKey')]);

 

심볼로 만든 프로퍼티 키는 미래에 추가될 키와도 절대 중복되지 않습니다.