[JavaScript] Symbol

Symbol을 알아야 하는 이유?

처음에 Symbol을 공부할 때에는 그런가 보다 하고 넘어갔는데 결국에는 다시 돌아와 공부하게 되었다. 제너레이터를 공부하다 보니 이터레이터를 알아야 하고, 이터레이터를 공부하다 보니 결국 Symbol을 알아야 했다. 그래서 Symbol, 이터레이터, 제너레이터까지 차례대로 공부하면서 정리하고자 한다.

Symbol

Symbol은 ES6에서 도입한 새로운 데이터 타입이다. 즉 숫자, 문자열, 불리언과 같은 원시 타입이다. Symbol()이라는 함수는 항상 Symbol 타입의 값을 반환하며 유일한 값이다.

 

Symbol()은 Symbol()과 같이 new 키워드를 사용할 수 없다.

 

Symbol 함수에 인자로 문자열을 입력할 수 있지만 특별한 기능은 존재하지 않는다. 굳이 차이가 있다면 이정도라고 할 수 있겠다.

 

Property에 사용하기 위한 Symbol

객체의 속성을 정의할 때 해당 객체의 유일한 속성을 정의하고 싶은 경우가 있다. 이때 객체의 유일한 속성을 정의하지 못하면 다음과 같은 문제가 발생한다.

 

user라는 객체에 key가 id이고 value가 1인 속성을 정의하고 이후에 의도하지 않게 다시 key가 id인 속성을 정의했다고 생각해보자. 이 경우 속성을 다시 정의했기 때문에 처음 정의한 value에 접근할 수 없다. 지금은 코드가 짧고 혼자 코드를 작성 중이기 때문에 이 실수를 알아채기 쉽지만 이 경우가 아니라면 어려울 것이다.

 

이때 Symbol 타입의 값을 속성의 key로 사용한다면 문제 해결이 가능하다. Symbol 타입의 값은 유일하기 때문이다. 문제를 해결하기 위해 다음과 같이 예제를 작성하였다.

 

user라는 객체에 Symbol 타입의 값을 속성의 key값으로 설정하였고 속성의 값에 원하는 값을 할당했다. 이렇게 되면 1을 할당한 속성 값은 id라는 변수를 이용하지 않는 이상 변경할 수 없다.

 

Symbol의 Static Properties

Symbol에는 static properties와 static method가 존재한다. Static property의 대표적인 예는 Symbol.iterator이다. Symbol.iterator는 객체의 이터레이터를 반환하는 함수를 가리킨다. 이터레이터는 다음 글에서 더 자세히 다루겠지만 항상 next()라는 메소드를 가지며 이 메소드는 value, done속성을 가진 객체를 반환한다. 배열은 이터레이터의 대표적인 예다. 따라서 배열에는 Symbol.iterator라는 Symbol 타입 값으로 접근 가능한 속성이 존재하고 그 속성의 값은 함수이다. 그 함수를 호출하면 이터레이터가 반환되는 것이다.

 

다시 Symbol의 기능으로 돌아가서 설명을 하겠다. 이터레이터 객체에 속성을 정의하고 싶은데 Symbol 타입의 값을 key로 하고 싶었고 이 값은 Symbol.iterator가 항상 가리키고 있도록 이터레이터 객체를 정의한 것이다.

Symbol의 Static Methods

Static method의 대표적인 예는 Symbol.for(key)이다. for 메소드는 Symbol 타입의 값을 반환하는데 같은 key를 사용하여 생성한 값은 같은 값이 된다.

 

이외에도 Symbol에는 다양한 속성이 존재하는데 자주 사용하는 내용만 정리하였다. 다음 글에서는 iterable과 iterator를 설명하겠다.

 

참고자료

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol

Symbol

https://javascript.info/symbol#system-symbols

Symbol type