ES6 심볼(Symbol) 타입

1. 심볼(Symbol) 타입이란?

: ES6에서 새롭게 도입된 원시형 타입 중 하나로 객체의 속성으로 사용한다.

- 유일한 식별자(unique identifier)를 만들고 싶을 때 사용한다.

- 유일무이한 값을 갖는다.

- 변경 불가능한 불변 값이다.

 

※원시형과 참조형

1. 원시형

: 객체가 아니면서 메서드를 가지지 않는 타입들로 원시형은 모두 하나의 정보 즉, 데이터를 담고 있다.

원시 자료형이 할당될 때에는 변수에 값(value) 자체가 담긴다

 

원시형 종류

- Number, String, Boolean, Undefined, Null, Symbol(ES6)

 

2. 참조형

: 원시형이 아닌 모든 타입들로 원시형 데이터의 집합이다.

참조 자료형이 할당될 대는 보관함의 주소(reference)가 담긴다.

 

참조형 종류

- Array([]), Object({}), function()

 

1-1. 심볼(Symbol) 사용의 이유

: 심볼은 유일성이 보장되는 자료형으로 설명이 동일한 심볼을 여러 개 만들어도 각 심볼값은 다르다. 심봄에 붙이는 설명은 어떤 것에도 영향을 주지 않는 이름표 역할만 하므로 충돌을 피할 수 있다.

 

let arr = [1, 2, 3, 4, 5];
alrert(arr.length);	// 5 (length: 요소의 길이를 알 수 있는 내장된 속성)

arr.length = 30;	// arr 배열에 length 속성을 정의하고 새로운 값 30 할당
alert(arr.length);	// 30

심볼을 사용하지 않으면 arr 배열 객체에 length라는 속성을 추가하려고 하였으나 내장된 속성인 length에 새로운 값만 할당하게 된다.

따라서 결과적으로 요소의 길이 값인 5는 사라지고 새로 정의한 30이라는 값이 할당된다.

 

위 코드를 심볼을 사용하면 아래와 같다.

let arr2 = [1, 2, 3, 4, 5];
const length = Symbol('length');
arr2[length] = 30;	// arr2 배열의 length 속성에 30 할당

alert(arr2.length);  // 5
alert(arr2[length]); // 30

위와 같이 객체에 속성을 추가하거나 덮어써질 우려가 있으면 충돌을 피하기 위한 수단으로 심볼(Symbol)을 사용한다.

 

※이때 Symbol() 괄호 안의 'length'는 단순 디버깅 용도이거나 단순 설명으로, 고유한 값을 가지는데 있어서 어떤 영향을 끼치지는 않는다.

심볼은 매번 심볼함수 호출 시 새로운심볼 값을 생성해내기 때문에 description인자는 심볼의 고유값을 구분하지 못한다.

let symbol  = Symbol('sample');
let symbol2 = Symbol('sample');

alert(symbol === symbol2); // false

 

1-2. 심볼의 출력 형태

- 심볼 값은 문자열형태로 변환할 수 없기 때문에 console.log 로 콘솔에 출력해야한다.

- 심볼형은 for .. in 구문으로 반복 시 출력되지 않는다. (은닉성)

let symbol3 = Symbol('name');
// alert(symbol3); error
console.log(symbol3); // Symbol(name) 형태로 출력

 

* 배열 객체에 속성을 추가하면 for .. in 반복문으로 출력 시 해당 속성도 같이 출력된다.

/* 배열 */
let arr3 = [1, 2, 3, 4, 5];
for (int i in arr3) {
	console.log(i);	// 0, 1, 2, 3, 4 -> index 값
}

arr3.someProperty = 10;
for (int k in arr3) {
	console.log(k); // 0, 1, 2, 3, 4, someProperty -> index값과 속성값
}

/* Symbol */
let arr3_ = [1, 2, 3, 4, 5];
let someProperty = Symbole('someProperty');

arr3_[someProperty] = 20;

for (let i in arr3_) {
	console.log(i);	// 0, 1, 2, 3, 4
}
// console.log(arr3_[someProperty]); // 10

배열 객체에 어떤 속성을 넣고 동시에 반복문에서 속성이 나타나지 않게 하려면 즉, 속성을 은닉화 하고자 한다면 심볼을 사용할 수 있다.