Symbol 타입의 변수

앞서 원시형 데이터 타입에 Symbol이란 것이 존재한다는 것을 확인을 해보았지만 이것이 무엇인지 알아보지는 않았습니다. 심볼형에 대해서 알아봅시다.

 

 

심볼은 유일한 식별자를 만드는데 사용됩니다.

 

대개 다수의 객체중 특정한 하나를 식별하는 키에 심볼을 사용합니다. 자바스크립트는 객체 프로퍼티 키로 오직 문자형과 심볼형만을 허용합니다. 

 

아래 예시는 숫자형, 불린형도 키로 쓸 수 있는 것처럼 보이지만 사실은 자동 형변환을 통해 전부 String 형으로 변환된 것입니다.

const obj1 = { age: 100 };
const obj2 = { 3: 100 };
const obj3 = { true: 100 };

console.log(typeof Object.keys(obj1)[0]); // string
console.log(typeof Object.keys(obj2)[0]); // string
console.log(typeof Object.keys(obj3)[0]); // string

 

 

이제는 객체 키에 심볼형을 넣어보겠습니다.

 

우선 심볼을 생성하는 간단한 방법부터 알아봅시다. 심볼은 이름이 같더라도 모두 별개로 취급됩니다. 

const id = Symbol("id");
const id2 = Symbol("id"); // 심볼은 고유한 값이기 때문에 네이밍이 같아도 다른 값으로 취급함


console.log(id); // Symbol(id)
console.log(id.description); // id. 심볼의 이름값을 출력함
console.log(typeof id); // Symbol
console.log(id === id2); // false

🚨 주의점
심볼은 위와 같이 자동 형변환이 되지 않음
Ruby 등의 언어에서도 '심볼’과 유사한 개념을 사용하는데, 자바스크립트의 심볼은 이들 언어에 쓰이는 심볼과는 다름

 

const user = {
  name: "Darren",
};

// 심볼 생성
const id = Symbol("id");

// user.id 로 생성하면 안됨
user[id] = "아무값이나";

console.log(user); // { name: 'Darren', [Symbol(id)]: '아무값이나' }

 

객체의 프로퍼티에 "아무값이나"라는 심볼값을 주었습니다. 심볼값을 할당하지 않고 직접 id라는 프로퍼티를 만들어주면 안되는 걸까요? 그렇게 되면 다른 스크립트에서 해당 객체를 사용할 때 id란 객체의 값이 충돌을 일으킬 수 있습니다.

 

심볼은 유일성이 보장되므로 우리가 만든 식별자와 제3의 스크립트에서 만든 식별자가 충돌하지 않습니다.

 

이렇게 할당한 심볼키는 숨김처리 됩니다. 이를 '(hiding symbolic property)'라 부릅니다. 이런 원칙 덕분에 외부 스크립트나 라이브러리는 심볼형 키를 가진 프로퍼티에 접근하지 못합니다.

 

예를 들어, for문이나 key 값을 출력하도록 해보면, 심볼키는 보이지 않습니다.

for (let key in user) {
  console.log(key);
}

console.log(Object.keys(user));