#3 JavaScript - 객체(Object)의 프로퍼티 어트리뷰트

자바스크립트 엔진은 프로퍼티를 생성할 때 프로퍼티의 상태를 나타내는 프로퍼티 어트리뷰트를 기본값으로 자동 정의한다.

프로퍼티 어트르뷰트에는 [[Value]], [[Writable]], [[Enumerable]], [[Configurable]]이 있다.

value	프로퍼티 키를 통해 프로퍼티 값에 접근하면 반횐되는값
writable	프로퍼티 변경 가능 여부를 나타내며 불리언 값
enumerable	프포퍼티 열거 가능 여부를 나타내는 불리언 값
configurable	프로퍼티 재정의 가능 여부를 나타내는 불리언 값

[[]]는 내부 슬롯과 내부 메서드를 말한다. 

프로퍼티 어트리뷰트에는 직접 접근할 수 없지만 Object.OnwPropertyDescriptor 메서드를 사용하여 확인 가능하다. 

Object.OnwPropertyDescriptor는 프로퍼티 어트리뷰트 정보를 제공하는 프로퍼티 디스크립터(PropertyDescriptor) 객체를 반환한다.

만약 존재하지 않는 프로퍼티나 상속받은 프로퍼티에 대한 프로퍼티 디스크럽터를 요구하면 undefinded를 반환한다. 

const object1 = {
  property1: 42,
};

const descriptor1 = Object.getOwnPropertyDescriptor(object1, 'property1');
const descriptor2 = Object.getOwnPropertyDescriptor(object1, 'property2');

console.log(descriptor1.configurable);
// Expected output: true

console.log(descriptor1.value);
// Expected output: 42

console.log(descriptor2.configurable);
// Error: Cannot read properties of undefined (reading 'configurable')
console.log(descriptor2.value);
// Error: Cannot read properties of undefined (reading 'value')

const object1 = {};

Object.defineProperty(object1, 'property1', {
  value: 42,
  writable: false,
});

object1.property1 = 77;
// Throws an error in strict mode

Object.defineProperty(object1, 'property2', {
  value: 42,
  writable: true,
});


object1.property2 = 77;

console.log(object1.property1);
console.log(object1.property2);

>42
>77

 

객체는 프로퍼티를 추가, 삭제, 갱신이 가능하고 프로퍼티 어트리뷰트를 재정이 할 수도 있다.
따라서 객체의 변경을 방지 하려면 Object.preventExtensions, Object.seal, Object.freeze를 사용하면 된다.

Object.preventExtensions	프로퍼티 삭제 , 읽기, 쓰기 가능 및 어트리뷰트 재정의 가능
Object.seal	프로퍼티 읽기, 쓰기 가능
Object.freeze	프로퍼티 읽기 가능

읽기만 가능한 객체를 만들려고 할때, 중첩 객체의 경우 객체를 값으로 같는 모든 프로퍼티의 재귀적으로 Object.freeze를 사용해야 한다. 

참고 링크:

• https://developer.mozilla.org/enUS/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptor
• https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/preventExtensions
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/seal
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze