26. Symbol

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

console.log(a === b); // false (서로 다른 고유한 값)

// 일반 문자열 키는 충돌 위험 존재
const user = {
  id: 123
};

// 나중에 실수로 덮어쓰기 가능
user.id = 456;

// 심벌을 사용하면 충돌 위험이 사라짐
const userId = Symbol('id');
user[userId] = 123;

// 절대로 다른 값으로 덮어쓸 위험이 없음

const PASSWORD = Symbol('password');

const user = {
  name: 'Alice',
  [PASSWORD]: '1234'
};

console.log(user.PASSWORD); // undefined (일반적인 방법으로 접근 불가)
console.log(user[PASSWORD]); // 1234 (정확한 심벌로만 접근 가능)

const iterable = {
  [Symbol.iterator]() {
    let i = 0;
    return {
      next() {
        return { value: i++, done: i > 3 };
      }
    };
  }
};

for (const val of iterable) {
  console.log(val); // 0, 1, 2
}

const mySymbol = Symbol('mySymbol');

// 심벌 값 자체는 원시 값이므로 프로퍼티가 없음.
// 하지만 description이나 toString을 사용할 때는 
// 임시 래퍼 객체(Symbol.prototype 객체)를 생성하여 접근함.
console.log(mySymbol.description);    // 'mySymbol'
console.log(mySymbol.toString());     // 'Symbol(mySymbol)'

// 아래 코드와 같은 내부 동작이 발생 (사용자는 못 봄!)
console.log((Object(mySymbol)).description);
console.log((Object(mySymbol)).toString());

// mySymbol은 원시 값이므로 객체처럼 프로퍼티에 접근할 수 없습니다.
// 하지만 프로퍼티 접근 시, 자바스크립트가 원시 값을 임시적으로 객체화시켜줍니다.
// 이때 생성된 임시 객체를 래퍼(Wrapper)객체라고 부른다.

// Symbol로 비밀 데이터를 보호하는 예시
const SECRET_KEY = Symbol();

// 중요한 정보를 저장하는 객체
const user = {
  name: 'Alice',
  [SECRET_KEY]: '비밀번호123!'
};

// 객체 출력 시
console.log(user); 
// { name: 'Alice', [Symbol()]: '비밀번호123!' }

// 일반적 접근 시도
console.log(user.SECRET_KEY);       // ❌ undefined
console.log(user['SECRET_KEY']);    // ❌ undefined
console.log(user[Symbol()]);        // ❌ undefined (새로운 심벌)

// 실제 SECRET_KEY 심벌을 알지 못하면 절대 접근할 수 없음
console.log(user[SECRET_KEY]);      // ✅ '비밀번호123!'
// 객체 생성시 사용했던 동익한 심벌값이 저장된 변수를 가지고 있어야만 접근 가능하다.

const sym1 = Symbol.for('myKey');
const sym2 = Symbol.for('myKey');

console.log(sym1 === sym2); // ✅ true (전역에서 같은 심벌을 참조)

// 라이브러리 코드
const LIB_CONFIG = Symbol.for('library.config');

// 사용자 코드
const userConfig = {
  [Symbol.for('library.config')]: {
    debug: true
  }
};

// 어디서든 같은 심벌로 접근 가능
console.log(userConfig[Symbol.for('library.config')]); // { debug: true }

const s1 = Symbol.for('myKey');
const s2 = Symbol('myKey');

console.log(Symbol.keyFor(s1)); // ✅ 'myKey' (전역 레지스트리에서 찾음)
console.log(Symbol.keyFor(s2)); // ❌ undefined (일반 심벌이므로 전역에 없음)

// 파일 A.js
export const KEY = Symbol('myKey');

// 파일 B.js
export const KEY = Symbol('myKey');

// 파일 A.js
const KEY = Symbol.for('sharedKey');

// 파일 B.js
const KEY = Symbol.for('sharedKey');

// A.js 와 B.js 에서 얻은 KEY 는 동일함
console.log(KEY === Symbol.for('sharedKey')); // true

// 라이브러리 코드
const LIB_CONFIG = Symbol.for('library.config');

// 사용자 코드
const userConfig = {
  [Symbol.for('library.config')]: {
    option: true
  }
};

const userConfig = {
  'library.config': {
    option: true
  }
};

// 접근 방법
console.log(userConfig['library.config']);  // ✅ { option: true }
console.log(userConfig["library.config"]);  // ✅ { option: true }
console.log(userConfig.library.config);     // 🚨 Error 발생 (library 속성이 없음)
console.log(userConfig['library']['config']); // 🚨 Error 발생 (library 속성이 없음)

const userConfig = {
  [Symbol.for('library.config')]: {
    option: true
  }
};

// 접근 방법
console.log(userConfig[Symbol.for('library.config')]); // ✅ { option: true }
console.log(userConfig['library.config']);             // ❌ undefined
console.log(userConfig.library);                       // ❌ undefined

Ex. ① 숫자 상수 방식
// 숫자 상수 방식
const Direction = { UP: 1, DOWN: 2 };

// 실수로 다른 값과 충돌 가능
const Status = { SUCCESS: 1, FAIL: 0 };
console.log(Direction.UP === Status.SUCCESS); // true (충돌 발생)


Ex. ② 심벌 상수 방식
// 심벌 상수 방식
const Direction = { UP: Symbol('up'), DOWN: Symbol('down') };

// 다른 객체가 비슷한 설명을 사용해도 충돌 불가능
const Status = { SUCCESS: Symbol('up'), FAIL: Symbol('fail') };

console.log(Direction.UP === Status.SUCCESS); // false (절대 충돌하지 않음)

// 사용자가 Array 프로토타입에 sum 메서드를 추가함
Array.prototype.sum = function () {
  return this.reduce((acc, cur) => acc + cur, 0);
};

[1, 2].sum();  // 3

// 심벌 키로 sum 메서드를 안전하게 추가
Array.prototype[Symbol.for('sum')] = function() {
  return this.reduce((acc, cur) => acc + cur, 0);
};

console.log([1, 2][Symbol.for('sum')]()); // 3