Symbol 이란??

Symbol 이란?? (숨김key 가능)

1. object 자료형의 key 값으로 사용될 수 있다. (원래는 문자열만 obj의 key로 올 수 있었음.)
2. object 자체를 바로 출력해버리면 symbol():value 이렇게 값이 드러난다. 
3. 그렇지만 반복문 안에서는 보이지 않는다. 

 

 

이렇게 사용한다. 

let 심볼 = Symbol('설명');
오브젝트.[심볼] = 넣을 값 입력;

 

 

좀더 자세한 예시를 살펴보자. 

Symbol 설정방법 1️⃣

let cat = {name : '빌리', age : 2};

//자료 넣을때 주로 하던 방법
//cat.character = '우주최고대마왕겁쟁이'; 

//Symbol자료 넣기.
let character = Symbol('어떤 성격을 가졋을까요?')
cat[character] = '우주최고대마왕겁쟁이';  

let color = Symbol('어떤 색상을 가졋을까요?')
cat[color]= '삼색냥';

console.log(cat);   
//{name: '빌리', age: 2, character: '우주최고대마왕겁쟁이', Symbol(어떤 성격을 가졋을까요?): '우주최고대마왕겁쟁이', Symbol(어떤 색상을 가졋을까요?): '삼색냥'}

console.log(cat[character])  // 우주최고대마왕겁쟁이

for(let key in cat){
  console.log(cat[key]); //  빌리 2 undefined
}

이처럼  cat[character]를 출력하면 자료가 나온다. 

❓👀  숨기는거라매요??

       👉직접적으로 요소를 가리키면 출력이 된다. 그렇지만  반복문에서는 보이지  않는다.

 

Symbol 자료가 출력이 안되는 이유는 바로 enumerable 하지 않기 때문이다. !!

(속성에 직접적으로 넣은게 아니니깐)'

 

 

Symbol 설정방법 2️⃣

let character = Symbol('냥냥이성격')
let cat = {name : '빌리', age: 2, [character] : '우주최강겁쟁이'}
console.log(cat); //{name: '빌리', age: 2, Symbol(냥냥이성격): '우주최강겁쟁이'}

변수에 Symbol(설명) 을 넣어준 뒤에, 

그 변수명을 대괄호로 감싸서  object 에 키로 넣고, 값도 같이 넣어주면 아주 간단하게 완성.

 

 

Symbol 특징 

• 설명이 같아도 다른 Symbol이다.  Symbol 을 만들때마다 새로 유니크한 각각의 Symbol이 생긴다. 
• 전역 Symbol 의 경우, 설명이 같으면 같은 Symbol 이다. 
• 내장 Symbol 사실 있었다!! 우리가 보지 못했을 뿐!!  대상.[Symbol.iterator] 콘솔에 찍어보면 보임.

 

 [Symbol.iterator] 

for ~of 반복문을 사용할 수 있도록 해준다. 

obj같은 경우 iterable 한 요소가 아니다.  근데 나는 for~of  반복문을 꼭 이용하고 싶다. 

그러면 obj 의  prototype 에 [Symbol.iterator] 를  추가해서 for ~of 반복문을 사용할 수 있도록 해준다. 

 

 

 

전역 Symbol

여러 객체에서 사용하고 싶을때 만듬.

let A = Symbol.for('설명'); 

 

 

 

Symbol 이 어떻게 쓰일 수 있을까? 

다른 자바스크립트 파일 가져와서 사용하거나, 라이브러리 가져오거나 한 상황

근데 그 안에 obj 수정해야 하는데 기존에 있던 코드를 최대한 안건드리고 싶을때.

반복문에 잡히지 않아서 에러가 발생할 확률이 낮다.