JS 기초 ) 심볼 (Symbol)

# Symbol() 은 유일한 식별자이다.

Symbol은 유일성을 보장한다.

console.log를 찍었을 때 같은 값으로 출력되지만 실질적으로는 다르다.

const a = Symbol(); 
const b = Symbol(); 

console.log(a); // Symbol()
console.log(b); // Symbol()

// a == b -> false
// a === b -> false

# Symbol에 설명을 추가하여 생성할 수 있다.

const a = Symbol('id');  //설명을 추가해서 생성할 수 있다
const b = Symbol('id'); 

console.log(a); // Symbol(id)
console.log(b); // Symbol(id)

// a == b -> false
// a === b -> false

# property key 를 Symbol을 통해 만들기

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

# Symbol을 사용하면 Object. 관련 함수들은 인식하지 않는다.

for문 사용시에도 Symbol로 만든 것은 건너뛴다.

Object.keys(user) // ["name","age"]
Object.values(user) // ["Mike",30]
Object.entriess(user) // [Array(2), Array(2)]
for(let a in user){} //Symbol은 안나옴

# 특정 객체의 원본데이터는 건들이지 않고, 속성을 추가할 수 있다.

const user = {
    name : "Mike",
    age : 30
}

const id = Symbol('id')
user[id] = 'myid'

Symbol.for() : 전역심볼

이름이 같으면 같은 객체를 가리켜야 할 때 사용

하나의 심볼만 보장 받을 수 있다. ( 없으면 만들고, 있으면 가져오기 때문에)

→ Symbol 함수는 매번 다른 Symbol 값을 생성하지만, 

    Symbol.for 는 하나를 생성한 뒤 키를 통해 같은 Symbol을 공유한다.

code 어디에서든 사용이 가능하다

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

// id1 === id2 ->true

//이름을 얻고싶다면
Symbol.keyFor(id1) //"id"

전역심볼이 아닌 심볼은 keyFor를 사용할 수 없다.

대신 description으로 이름을 알 수 있다.

const id = Symbol('id' 입니다.')
id.description; // "id' 입니다."

# Symbol을 완전히 숨기는 방법은 없다.

숨겨진 Symbol key 보는 법 ↓

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

Object.getOwnPropertySymbols(user); // [Symbol(id)]

// Symbol을 포함한 모든 객체의 key를 출력
Reflect.ownKeys(user); // ["name", "age", Symbol(id)]

# Symbol 을 활용한 코드 예제

// 다른 개발자가 만들어 놓은 기존 객체
const user = {
    name : "Mike",
    age : 30
};

// 내가 추가 작업 진행
// user.showName = function () {}; -> His showName is function () {}. 로 출력됨 
const showName = Symbol("show name");
user[showName] = function () {
    console.log(this.name);
};

user[showName]();

// 사용자가 접속하면 보는 메시지
for (let key in user) {
    console.log(`His ${key} is ${user[key]}. `);
}

showName이 실행 된 것

기존 user의 값들 중 Symbol 제외하고 출력

 

 

 

 

 

 

 

 

참고 :  

https://www.youtube.com/watch?v=4_WLS9Lj6n4&t=1158s