JavaScript Attribute Descriptor

agnusdei1207·2023년 7월 6일
0

JavaScript에서 속성(attribute)은 객체의 상태를 설명하는 데 사용됩니다. 속성은 객체의 특징이나 행동을 나타내며, 속성의 값을 가져오거나 설정할 수 있습니다. JavaScript에서 속성은 두 가지 주요 요소로 구성됩니다: 속성(attribute)과 속성 서술자(property descriptor)입니다.

  1. 속성(Attribute):

    • 속성은 JavaScript 객체의 특정 특징을 나타냅니다.
    • 모든 속성은 이름(문자열)과 값으로 구성됩니다.
    • 속성은 객체의 상태를 나타내는 변수처럼 동작하며, 해당 객체의 값을 나타냅니다.
    • 예를 들어, 객체의 속성으로 "이름"과 "나이"가 있다면, "이름"은 문자열 값이고 "나이"는 숫자 값일 수 있습니다.
  2. 속성 서술자(Property Descriptor):

    • 속성 서술자는 속성의 특징을 설명하고 제어하는 데 사용됩니다.
    • 속성 서술자는 속성의 동작 방식을 조정하는 설정 값들을 포함합니다.
    • 각 속성마다 속성 서술자를 가지고 있으며, 이를 통해 속성의 특성을 제어할 수 있습니다.
    • 속성 서술자는 속성의 수정 가능성, 열거 가능성, 설정 가능성, 값 등에 대한 정보를 제공합니다.

속성 서술자에는 다음과 같은 속성들이 있습니다:

  1. 값(Value): 속성에 대한 현재 값입니다.
  2. 수정 가능성(Writable): 값의 변경 가능 여부를 나타내는 부울 값입니다.
  3. 열거 가능성(Enumerable): 속성이 for...in 루프와 같은 반복 구조에서 열거 가능한지 여부를 나타내는 부울 값입니다.
  4. 설정 가능성(Configurable): 속성 서술자를 수정하고 속성을 삭제할 수 있는지 여부를 나타내는 부울 값입니다.

이제 코드 예시를 통해 속성과 속성 서술자를 더 자세히 살펴보겠습니다:

const obj = {};

// 속성 추가
obj.name = "John";

// 속성 서술자 확인
const descriptor = Object.getOwnPropertyDescriptor(obj, "name");
console.log(descriptor);
// 출력: { value: 'John', writable: true, enumerable: true, configurable: true }

// 속성 서술자 수정
Object.defineProperty(obj, "name", {
  writable: false,
  enumerable: false
});

// 수정된 속성 서술자 확인
const updatedDescriptor = Object.getOwnPropertyDescriptor(obj, "name");
console.log(updatedDescriptor);
// 출력: { value: 'John', writable: false, enumerable: false, configurable: true }

// 속성 값 변경 시도
obj.name =

"Tom";
// TypeError: Cannot assign to read only property 'name' of object '#<Object>'

// 열거 가능한 속성 확인
for (let key in obj) {
  console.log(key);
}
// 출력: (아무것도 출력되지 않음)

// 속성 삭제 시도
delete obj.name;
// TypeError: Cannot delete property 'name' of object '#<Object>'

위의 코드 예시에서는 빈 객체 obj를 생성하고, name 속성을 추가합니다. Object.getOwnPropertyDescriptor 메서드를 사용하여 name 속성의 속성 서술자를 확인할 수 있습니다. 초기 속성 서술자에서는 value: 'John', writable: true, enumerable: true, configurable: true와 같은 값들을 볼 수 있습니다.

Object.defineProperty 메서드를 사용하여 name 속성의 속성 서술자를 수정할 수 있습니다. 위의 예시에서는 writablefalse로 설정하여 속성 값을 변경할 수 없게 만들고, enumerablefalse로 설정하여 for...in 루프에서 열거할 수 없게 만듭니다. 수정된 속성 서술자를 확인하면 변경된 값을 볼 수 있습니다.

마지막으로, 속성 값 변경 시도와 속성 삭제 시도를 통해 수정 가능성과 설정 가능성에 대한 동작을 확인할 수 있습니다. writablefalse로 설정되어 있으므로 속성 값을 변경하려고 시도하면 TypeError가 발생합니다. 또한, enumerablefalse로 설정되어 있으므로 for...in 루프에서는 해당 속성이 열거되지 않습니다. configurabletrue로 설정되어 있으므로 속성을 삭제할 수 없지만, false로 설정하면 속성을 삭제할 수 없도록 제한할 수 있습니다.

이러한 방식으로 속성과 속성 서술자를 사용하여 JavaScript 객체의 동작을 제어할 수 있습니다.

0개의 댓글