자바스크립트에서는 객체의 프로퍼티를 설정할 때, 그 값을 직접 할당하는 방법 외에도 getter와 setter를 사용하여 프로퍼티에 접근하고 값을 조작하는 방법을 제공합니다. 이를 통해 객체의 상태를 제어하고 유효성 검사 등의 로직을 추가할 수 있습니다.

Getter와 Setter란?

Getter와 Setter는 객체의 프로퍼티에 접근하여 값을 가져오거나 설정하는 메서드로, 자바스크립트에서는 get과 set 키워드를 사용하여 선언합니다.

const obj = {
  _name: 'John',
  get name() {
    return this._name;
  },
  set name(value) {
    this._name = value;
  }
};

console.log(obj.name); // 'John'
obj.name = 'Kate';
console.log(obj.name); // 'Kate'

위 예제에서는 _name이라는 내부 변수에 실제 값을 저장하고, name이라는 getter와 setter를 정의하여 접근하는 방식입니다. obj.name을 호출하면 getter 메서드가 실행되어 _name의 값을 반환하고, obj.name = 'Kate'와 같이 값을 할당하면 setter 메서드가 실행되어 _name의 값을 변경합니다.

프로퍼티 디스크립터

프로퍼티 디스크립터를 사용하면 객체의 프로퍼티에 대한 제한과 속성을 자세히 설정할 수 있습니다. Object.defineProperty를 사용하여 프로퍼티 디스크립터를 정의할 수 있습니다.

const obj = {};

Object.defineProperty(obj, 'name', {
  get: function() {
    return this._name;
  },
  set: function(value) {
    this._name = value;
  },
  enumerable: true,
  configurable: true
});

console.log(obj.name); // undefined
obj.name = 'John';
console.log(obj.name); // 'John'

위 예제에서는 Object.defineProperty를 사용하여 obj 객체에 name 프로퍼티를 정의합니다. getter와 setter는 이전 예제와 동일한 방식으로 동작하며, enumerable과 configurable 속성이 true로 설정되어 프로퍼티가 열거 가능하고 재정의 가능한 것을 의미합니다.

프로퍼티 디스크립터의 다양한 속성

프로퍼티 디스크립터에는 다양한 속성을 설정할 수 있습니다. 일부 자주 사용되는 속성은 다음과 같습니다:

• enumerable: true일 경우 프로퍼티가 for...in 루프나 Object.keys 등으로 열거 가능합니다.
• configurable: true일 경우 프로퍼티의 속성을 변경하거나 삭제할 수 있습니다.
• get: getter 함수를 정의하는 속성입니다.
• set: setter 함수를 정의하는 속성입니다.

더 많은 속성과 사용 예제에 대해서는 MDN 문서를 참고하시기 바랍니다.

프로퍼티 디스크립터를 사용하면 객체의 프로퍼티에 직접 접근하는 것보다 더 많은 제어력과 유연성을 가질 수 있습니다. 필요에 따라 getter와 setter를 활용하여 객체의 상태를 보호하고 커스텀 로직을 추가하는 방법에 대해 알아보았습니다.