ES6 lessons 10. 심볼

 

2023.04.02

자바스크립트 스터디 11회차

공부 사이트: https://poiemaweb.com/

 

10. 심볼

심볼은 ES6에서 새롭게 추가된 타입으로, 변경 불가능한 원시 타입의 값이다.

주로 충돌할 위험이 없는 객체의 프로퍼티 키를 만들기 위해 사용한다.

 

let mySymbol = Symbol();

console.log(mySymbol);
console.log(typeof mySymbol);

Symbol() 함수는 래퍼 객체를 생성하는 생성자 함수와 달리, new 연산자를 사용하지 않는다.

해당 함수에 문자열을 인자로 전달할 수 있으나, Symbol 생성에 어떠한 영향도 주지 않는다. 단지 생성한 Symbol에 대한 설명을 달아줄 뿐이다. (디버깅 용도)

 

 

1) Symbol의 사용

Symbol 값은 유일한 값이므로, 객체의 프로퍼티 키에 Symbol 값을 사용하면 다른 어떤 프로퍼티와도 충돌하지 않는다.

const obj = {};

const mySymbol = Symbol('mySymbol');
obj[mySymbol] = 123;

console.log(obj);
console.log(obj[mySymbol]);

 

 

2) Symbol 객체

Symbol() 함수로 Symbol값을 생성할 수 있다. 이는 Symbol이 함수 객체라는 것을 의미한다.

Symbol객체는 프로퍼티와 메소드를 가지고 있으며, Symbol객체의 객체와 프로퍼티 중 length와 prototype을 제외한 프로퍼티를 Well-Known Symbol이라고 부른다.

 

Well-Known Symbol은 자바스크리븥 엔진에 상수로서 존재하며, 엔진은  Well-Known Symbol를 참조하여 일정한 처리를 한다. 

 

① Symbol.iterator

어떤 객체가 Symbol.iterator를 프로퍼티 키로 사용하여 메소드를 구현하고 있다면, 자바스크립트 엔진은 이 객체가 이터레이션 프로토콜을 따른다고 간주하고 이터레이터로 동작하도록 한다.

/*
Symbol.iterator를 프로퍼티 키로 사용하여 메소드를 구현하고 있는 빌트인 객체.
아래 객체들은 이터레이터를 반환한다.
*/

// Array
Array.prototype[Symbol.iterator]

// String
String.prototype[Symbol.iterator]

// Map
Map.prototype[Symbol.iterator]

// Set
Set.prototype[Symbol.iterator]

// DOM data structures
NodeList.prototype[Symbol.iterator] HTMLCollection.prototype[Symbol.iterator]

// arguments
arguments[Symbol.iterator]

 

② Symbol.for

인자로 받은 문자열을 키로 사용하여 Symbol 값들이 저장되어 있는 전역 Symbol 레지스트리에서 해당 키와 일치하는 Symbol 값을 검색한다.

ㅇ 검색 성공 : 검색된 Symbol 값을 반환.

ㅇ 검색 실패 : 새로운 Symbol 값을 생성하여 해당 키로 전역 Symbol 레지스트리에 저장한 후 Symbol 값을 반환

 

Symbol.for 메소드는 하나의 Symbol을 생성하여 여러 모듈이 키를 통해 같은 Symbol을 공유할 수 있다.

Symbol.for 메소드를 통해 생성된 Symbol 값은 반드시 키를 갖는다.