심볼

 

// property keys : 문자형 

const obj = {
    1: '1입니다',
    false : '거짓' // key를 숫자나 boolean 형으로 만들어봤자...
}

console.log(Object.keys(obj)); 
// [ '1', 'false' ] // 어차피 문자형으로 반환

//그런데 property key 로 하나 더 가능한게 있다! 그게 symbol!!!!
const a = Symbol(); // new 같은거 필요 없다. symbol은 유일한 식별자를 만들 때 사용한다.
const b = Symbol();

console.log(a) //Symbol()
console.log(b) //Symbol() //요렇게 생긴 것은 같지만...

console.log(a==b) // false // 일치연산자로 확인하면 false가 나온다?!
console.log(a===b) // false

// Symbol : 유일성보장. 전체 코드 중 딱 하나.
const id = Symbol('id'); // sybol 만들 때 괄호 안에 문자열로 설명을 붙여줄 수 있다.
                        // 설명을 붙여놓으면 디버깅할 때 편하다. 그러나 저 문자열은 symbol에 아무 영향미치지 않는다.
const id2 = Symbol('id')
console.log(id === id2) // false // 생긴게 같아도 다르다.
console.log(id == id2) // false

// property key : 심볼형
const id = Symbol('id');
const user = {
    name : 'Mike',
    age : 30,
    [id] : 'myid' //computed property 로 key를 넣었다. Symbol을 드디어 넣어보았다....
}

console.log(user) //{ name: 'Mike', age: 30, [Symbol(id)]: 'myid' }

//그러나 key() 로 한번 key 배열을 가져와 보자고.
console.log(Object.keys(user)) //[ 'name', 'age' ] // 심볼은 어디로 갔나??
console.log(Object.values(user)) // [ 'Mike', 30 ]
console.log(Object.entries(user)) // [ [ 'name', 'Mike' ], [ 'age', 30 ] ]
for(let a in user){} // for in 을 써도 sybol은 건너뛴다!  

 //이렇게 꽁꽁 숨겨진 symbol은 그래서 어디에 써먹는 용도인가?
 //객체의 원본데이터는 건드리지 않고, 속성을 추가할 수 있다.

 //예컨대, 아래 user2 객체에 id2 심볼을 모오올래 추가하는 것.
 const user2 = {
    name : 'Mike',
    age : 30}
 
 const id2 = Sybol('id')   
 user2[id2] = 'myid'; 
 // 코드 어디선가 user2.name = 'myname' 이렇게 멋대로 덮어써버리면 안된다.   
 // 코드 어디선가 user.a_key_no_one_used = 'hahaha'; 이따위 장황한 프로퍼티가 막 들어와도 안된다.
 // 이 객체를 어디선가 Object.keys() 혹은 for in 으로 순회하면서 데이터를 사용하고 있을 수도 있다고.
 // 저렇게 덮어쓰고 추가한 프로퍼티가 어디서 어떻게 튀어나올지 몰라.

---

전역심볼

// Symbol.for() : 전역심볼
// 하나의 심볼만 보장받을 수 있음
// 없으면 만들고, 있으면 가져오기 떄문
// Symbol 함수는 매번 다른 Symbol 값을 생성하지만,
// Symbol.for 메소드는 하나를 생성한 뒤 키를 통해 같은 Symbol을 공유.

const id1 = Symbol.for('id');
const id2 = Symbol.for('id');
console.log(id1 === id2) // true 
//for 없이 생성했을 때는 false 였다!!!! //이래서 전역심볼이라 부른다. 코드 어디서든 사용할 수 있다.

const force1 = Symbol.for('Jedi')
const force2 = Symbol.for('Jedi')
console.log(force1 === force2) //true

//이름을 얻고 싶다면
console.log(Symbol.keyFor(force1)) // Jedi
//keyFor(변수명) 메소드를 이용하면, 생성할 때 적어주었던 이름을 알려준다.

//전역심볼이 아닌 심볼은 keyFor 를 사용할 수 없다. 대신 description으로 알려준다.
const force3 = Symbol('sith입니다')
console.log(force3.description) // sith입니다

 

---

심볼 찾아내는 메소드

//사실 symbol을 완전히 숨길 수는 없다.
//숨겨진 Symbol key 보는 법

const id = Symbol('id');

const user = {
    name : 'Mike',
    age : 30,
    [id] : 'myid'
}

//다음의 장황한 메소드를 사용하면 객체의 숨겨진 심볼이 튀어나온다.
console.log(Object.getOwnPropertySymbols(user)) // [ Symbol(id) ] 

//아래 메소드는 심볼을 포함한 객체의 모든 프로퍼티를 보여준다.
console.log(Reflect.ownKeys(user)) // [ 'name', 'age', Symbol(id) ]

//그러나 대부분의 라이브러리는 저런 메소드 사용하지 않는다. 그러니 symbol로 몰래 넣는거 열심히 해보자.

---

심볼의 유용함

//다른 작업자가 만들어 놓은 객체
const user = {
    name : 'Mike',
    age : 30,
};

//내가 작업
const force = Symbol("May the Force be with you")
user[force] = function(){
    console.log(this.name); 
}

user[force](); //Mike //this.name을 콘솔에 찍으라는 함수이니까. 이렇게  명시적으로 해야만 symbol이 나온다.

// 사용자가 접속하면 보는 메시지
for (let key in user){
    console.log(`His ${key} is ${user[key]}.`);
}
//His name is Mike.
//His age is 30.
// 아주 초보적인 깨달음. 객체[key] 쓰면 value 가 튀어나오는구나....
//하여튼 force 라는 변수로 만든 Symbol 은 for in 으로 key 값을 다 불러도 나오지 않는다.