// 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 값을 다 불러도 나오지 않는다.