Colin's Blog
[javascript] 프로퍼티 디스크립터와 동적으로 생성되는 프로퍼티

자바스크립트에서 객체의 프로퍼티는 디스크립터(descriptor)라고 불리는 특정 속성을 가지고 있습니다. 프로퍼티 디스크립터는 프로퍼티에 대한 여러 가지 정보를 담고 있으며, 객체의 동작을 정의하는 데 중요한 역할을 합니다.

프로퍼티 디스크립터 속성

프로퍼티 디스크립터는 다음과 같은 속성들을 가지고 있습니다.

프로퍼티 디스크립터의 예시

다음은 name이라는 프로퍼티를 가진 객체의 프로퍼티 디스크립터를 생성하는 예시입니다.

var obj = {
  name: 'John'
};

var descriptor = Object.getOwnPropertyDescriptor(obj, 'name');
console.log(descriptor);

위 예시에서 Object.getOwnPropertyDescriptor() 메서드를 사용하여 name 프로퍼티의 디스크립터를 가져오고, 이를 console.log()로 출력합니다. 결과는 다음과 같습니다.

{
  value: 'John',
  writable: true,
  enumerable: true,
  configurable: true
}

위 결과에서 name 프로퍼티는 값이 변경 가능하고, 열거 가능하며, 수정 및 삭제가 가능하다는 것을 확인할 수 있습니다.

동적으로 프로퍼티 생성하기

자바스크립트에서는 객체에 동적으로 새로운 프로퍼티를 추가할 수 있습니다. 이 경우에도 프로퍼티 디스크립터를 사용하여 프로퍼티의 속성을 지정할 수 있습니다.

다음 예시는 person 객체에 동적으로 age 프로퍼티를 추가하는 방법을 보여줍니다.

var person = {};

Object.defineProperty(person, 'age', {
  value: 25,
  writable: false,
  enumerable: true,
  configurable: false
});

console.log(person.age);

위 예시에서 Object.defineProperty() 메서드를 사용하여 person 객체에 age 프로퍼티를 추가합니다. 이때 value 속성을 25로, writable 속성을 false로, enumerable 속성을 true로, configurable 속성을 false로 설정합니다. 마지막으로 console.log()를 통해 person.age를 출력합니다.

위 예시에서 writable 속성을 false로 설정하였기 때문에, person.age 값을 변경할 수 없습니다.

프로퍼티 디스크립터를 사용하여 객체에 동적으로 프로퍼티를 추가하고, 해당 프로퍼티의 속성을 한정하는 것은 자바스크립트에서 객체의 동작을 세밀하게 제어하기 위한 유용한 기능입니다.

참고 자료

© 2018 Colin. All rights reserved.