[javascript] ES6 최신 문법 1 _ Symbol

 

Symbol

ES6 이전의 자바스크립트 데이터 타입은 문자열, 숫자, 불리언, undefined, null, 객체 6가지 타입이 있었다. 심볼은 새롭게 도입된 7번째 데이터 타입으로 변경 불가능한 원시 타입의 값이다. 주로 이름의 충돌 위험이 없는 유일한 프로퍼티 키를 만들기 위해 사용한다.

 

심볼 값은 심볼 함수를 호출하여 생성하고, 이때 생성된 심볼 값은 외부로 노출되지 않아 확인할 수 없다. 

const symbol = Symbol('yeonmi');
console.log(typeof symbol);  //output: symbol
console.log(symbol);  //output: Symbol(yeonmi)

 

심볼에는 new 키워드를 붙이지 않고 생성하며, 괄호 안에 쓰는 것은 생성된 심볼 값에 대한 설명(키)이다. .description 프로퍼티를 통해 설명을 출력해 볼 수 있다. 

const key1 = 'key';
const key2 = 'key';

const key3 = Symbol('key');  
const key4 = Symbol('key');

console.log(key1 === key2); // output: true
console.log(key3 === key4); // output: false
console.log(key3.description === key4.description); //true

Symbol('desc').toString();   // "Symbol(desc)"
Symbol('desc').description;  // "desc"
Symbol('').description;      // ""
Symbol().description;        // undefined

 

.for 메서드는 심볼 값을 검색하여 없으면 새로운 심볼 값을 생성하고, 있으면 해당 심볼 값을 반환한다. .keyfor 메서드는 심볼 값의 키를 출력한다.

const k1 = Symbol.for('key');
const k2 = Symbol.for('key');
console.log(k1 === k2);  //true

console.log('Symbol =', Symbol.keyFor(k1)); //Symbol = key

 

객체의 프로퍼티 키로 심볼 값을 사용하게 되면 다른 키와 충돌이 없고, Object.keys나 Object.getOwnPropertyNames 메서드에 조회되지 않아 은닉할 수 있다.

const obj = {};
const sym = Symbol();
obj[sym] = '심볼 키의 값 ';
obj.propKey = '일반 키의 값 ';

console.log(obj); //{ propKey: '일반 키의 값 ', [Symbol()]: '심볼 키의 값 ' }
console.log(obj[sym]); //심볼 키의 값 
console.log(obj.sym); //undefined
console.log(obj[Symbol()]); //undefined
console.log(sym in obj); //true
console.log(Object.keys(obj)); //[ 'propKey' ]

// 아래의 메서드로 심볼 키를 출력할 수 있다.
console.log(Object.getOwnPropertySymbols(obj)); //[ Symbol() ]
console.log(Reflect.ownKeys(obj)); //[ 'propKey', Symbol() ]