자바스크립트 - 심볼(Symbol)

property key : 문자형

지금까지 객체 property key는 문자형으로 만들었습니다. 하지만 아래처럼 숫자형이나 불린형으로 만들어 보면 어떨까요?

const obj = {
  1:'1입니다.',
  false:'거짓'
}

Object.keys(obj); // ["1", "false"]

 

keys()함수를 통해 확인을 해보면 1과 false가 문자형으로 반환됩니다.  그리고 실제로 접근을 할때도 문자형으로 접근할 수 있습니다. 

obj['1'] // "1 입니다."
obj['false'] // "거짓"

이렇게 객체 property는 문자형으로 가능합니다. 그리고 하나더 가능한것이 있는데 바로 Symbol입니다. 

 

Symbol

Symbol은 유일한 식별자를 만들 때 사용합니다. 즉 유일성이 보장됩니다. 

const a = Symbol(); // new를 붙이지 않는다.
const b = Symbol();

위와 같이 생긴것은 똑깥은데 console.log(a), console.log(b) 를 해보면 둘다 Symbol()을 출력하고

a===b; a==b; 를 해보면 둘다 false를 출력합니다. 

 

symbol을 객체의 propery key로 사용할 수 있습니다. 

const id = Symbol('id');
const user = {
	name : 'Mike',
  	age : 30,
  	[id] : 'myid',
}

// --> 출력 해보면
{name : "Mike" , age: 30 , Symbol(id) : "myid"}

그래서 이전에 배운 함수들로 키를 확인해보면 symbol로 만든 propery가 보일까?

아닙니다. 이전에 배운 여러 객채 메소드들은 심볼형을 건너뜁니다.

Object.keys(user); // ["name", "age"]
Object.values(user); // ["Mike", 30]

 

Symbol.for() 

Symbol.for() : 전역심볼입니다. 

• 하나의 심볼만 보장받을 수 있습니다.
• 없으면 만들고, 있으면 가져오기 때문입니다. 
• Symbol함수는 매번 다른 Symbol 값을 생성하지만 
• Symbol.for 메소드는 하나를 생성한 뒤 키를 통해 같은 Symbol을 공유합니다. 

const id1 = Symbol.for('id');
const id2 = Symbol.for('id');

id1 === id2;  // true

이름을 얻고 싶으면 Symbol.keyFor(id1); //"id" 를 사용합니다.

그리고 전역심볼이 아닌 심볼은 keyFor을 사용할 수 없습니다. 대신 description으로 이름을 알 수 있습니다. 

 

 

숨겨진 Symbol key 보는 법

Object.getOwnPropertySymbols(user); // [Symbol (id)] 심볼들만 보여줍니다. 

Reflect.ownKeys(user); // ["name", "age", Symbol(id)] 심볼 포함 모든키를 보여줍니다. 

 

정리

그래서 심볼을 왜 언제 사용해야 하나요?

유일한 프로퍼티를 추가하고 싶을 때 Symbol을 사용하자!