[코딩애플] js part 3-8. Symbol 자료형

Symbol 자료형은 쓸모없어보이는데 왜 있는거죠

쓸데없는 Symbol

• ES6부터 추가된 자료형
• 그렇게 실용성있진 않음

사용법

var 심볼 = Symbol('설명');

용도

1. Object 자료형의 비밀스런 key값

object를 하나 만들어보자.

var person = { name : 'Kim'};

근데 만약 밖에 공개하기 싫은 비밀스런 데이터(weight)를 저장하고 싶다면?

일반적이면 이렇게 저장하겠지만

person.weight = 100;
person; // {name: 'Kim', weight: 100}

Symbol을 이용해서 비밀스런 데이터를 저장해보자.

**원래 Object의 key값에는 string만 가능했는데, 이제 Symbol도 넣을 수 있다.**

var weight = Symbol('내 시크릿 몸무게임');

var person = { name: 'Kim'};
person.weight = 100;
person[weight] = 200;

person; // {name: 'Kim', weight: 100, Symbol(내 시크릿 몸무게임): 200}

object에 담긴 모든 자료형들을 출력하는 for in 을 사용해보자.

for (var key in person) {
    console.log(person[key]);
}
// 'Kim'
// 100

**Symbol로 작성한 데이터는 반복문에서 출력하지 않는다**. 왜냐하면 **enumerable이 false**기 때문이다. (속성이 없음)

예제

Symbol을 이용하여 여러분 키를 저장해보세요.

var height = Symbol('내 키임');

var person = { name: 'Heo'};
person[height] = 167;

혹은 Symbol 직접 넣어도 OK

var height = Symbol('내 키임');

var person = { name: 'Heo', [height]: 167 };

2. import 해온 파일 / 라이브러리 쓸 때, 거기 있던 object에 자료를 추가하고 싶다면.

반복문에도 안뜨니까 기존 코드를 해칠 염려가 없다.

Symbol 특징

1. 설명이 같다고 같은 Symbol이 아님. Symbol 만들 떄마다 유니크한 Symbol이 생김.

var a = Symbol('설명1');
var b = Symbol('설명1');
a === b; // false

a와 b의 심볼에 설명이 동일해도 각 심볼은 다르다.

2. 전역 변수같은 전역 Symbol? => Symbol.for()로 만드는 전역 심볼

공통적인 심볼을 부여하고 싶다면?

var person = { name: 'kim', [height]: 160 };
var person1 = { name: 'kim', [height]: 160 };
var person2 = { name: 'kim', [height]: 160 };

그러면 전역 심볼을 만들면 된다.

var a = Symbol.for('설명1');
var b = Symbol.for('설명1');

Symbol.for()은 같은 설명을 가지고 있는 심볼이 이미 위에 있으면 기존 심볼을 복붙해준다.

var a = Symbol.for('설명1');
var b = a;

위랑 동일한 코드다.

var a = Symbol.for('설명1');
var b = Symbol.for('설명1');

a === b; // true

별로 쓸데도 없긴 함.

3. 기본 내장 Symbol들

Symbol을 만들고 출력을 할 때 이렇게 했었다.

person[weight]; // 200

저번 시간에 봤던 Symbol.iterator도 똑같다!

var 어레이 = [2,3,4];
어레이[Symbol.iterator]; // ⬅️ 자바스크립트가 array에 집어넣는 기본 Symbol