객체의 프로퍼티 키(문자열, 심벌값)

객체는 프로퍼티의 집합이며, 프로터티는 키와 값으로 구성된다.

• 프로퍼티 키 : 빈 문자열을 포함하는 모든 문자열 또는 심벌 값
• 프로퍼티 값 : JS에서 사용할 수 있는 모든 값

① 이때 프로퍼티 키로 문자열을 쓸 때 문자열이므로 따옴표로 묶어야한다. 하지만 식별자 네이밍 규칙을 준수하는 이름인 경우 따옴표를 생략할 수 있다.

② 프로퍼티 키에 문자열이나 심벌 값 외의 값을 사용하면 암묵적 타입 변환을 통해 문자열이 된다.

③ 프로퍼티 키에 접근하는 방법은 두가지다

• 마침표 프로퍼티 접근 연산자(.)를 사용하는 마침표 표기법
• 대괄호 프로퍼티 접근 연산자([...])를 사용하는 대괄호 표기법
  이때, 대괄호 내부에 지정하는 프로퍼티 키는 반드시 따옴표로 감싼 문자열이어야 한다. 따옴표로 감싸지 않은 이름을 사용하면 JS엔진은 식별자로 해석한다

④ 프로퍼티 키가 식별자 네이밍 규칙을 준수하지 않는 이름일 경우 반드시 대괄호 표기법을 사용해야 한다. 단, 프로퍼티 키가 숫자로 이뤄진 문자열인 경우 따옴표를 생략할 수 있다.

출처 : 이웅모, ⌜모던 자바스크립트 Deep Dive⌟, 위키북스, 2022, 127~131쪽

⑤ 심벌 값을 프로퍼티 키로 사용하려면 프로퍼티 키로 사용할 심벌 값에 대괄호를 사용해야 한다. 프로퍼티에 접근할 때도 마찬가지로 대괄호를 사용해야 한다.

심벌 값은 유일무이한 값이므로 심벌 값으로 프로퍼티 키를 만들면 다른 프로퍼티 키와 절대 충돌하지 않는다.

출처 : 이웅모, ⌜모던 자바스크립트 Deep Dive⌟, 위키북스, 2022, 610쪽

  a = Symbol();
  const obj = { [a]: "심볼값 프로퍼티키의 값", a: "문자열 프로퍼티키의 값", b:1 };
  console.log(obj); // {a: '문자열 프로퍼티키의 값', b: 1, Symbol(): '심볼값 프로퍼티키의 값'}
  console.log(obj.b); // 1
  // console.log(obj[b]); // reference error
  console.log(obj.a); // 문자열 프로퍼티키의 값
  console.log(obj["a"]); // 문자열 프로퍼티키의 값
  console.log(obj[a]); // 심볼값 프로퍼티키의 값

⑥
Object.getOwnPropertyDescriptor, Object.defineProperty, Object.prototype.hasOwnProperty, in 연산자 등에 인수 혹은 피연산자로 프로퍼티키를 문자열 형태로 넣어주는 건 문자열인 프로퍼티키를 사용할 때다.

Object.getOwnPropertyNames 역시 문자열인 프로퍼티키들로 구성된 배열을 반환

  console.log(typeof Symbol.iterator); // symbol
  console.log(Array.prototype.hasOwnProperty(Symbol.iterator)); // true
  console.log(Array.prototype.hasOwnProperty("Symbol.iterator")); // false

  a = Symbol('a');
  const obj = { [a]: "심볼값 프로퍼티키의 값", a: "문자열 프로퍼티키의 값", b:1 };
  console.log(Object.getOwnPropertyNames(obj)); // (2) ['a', 'b']
  console.log(Object.getOwnPropertySymbols(obj)); // [Symbol(a)]
  console.log(Object.getOwnPropertyDescriptor(obj,'a')) // {value: '문자열 프로퍼티키의 값', writable: true, enumerable: true, configurable: true}
  console.log(Object.getOwnPropertyDescriptor(obj,a)) // {value: '심볼값 프로퍼티키의 값', writable: true, enumerable: true, configurable: true}