자바스크립트에서는 객체의 프로퍼티에 접근자(getter)와 설정자(setter)를 정의하여 프로퍼티에 접근하거나 값을 설정할 때 사용할 수 있습니다. 이러한 접근자 프로퍼티는 객체의 특정 프로퍼티에 대한 접근을 제어하고, 프로퍼티 값을 읽거나 설정하기 전에 추가 동작을 수행할 수 있도록 합니다.
get
접근자:
get
키워드를 사용하여 객체의 프로퍼티에 접근할 때 해당 프로퍼티 값을 반환하는 메서드를 정의합니다. get
접근자를 사용하면 프로퍼티 값을 읽을 때마다 추가적인 동작을 수행할 수 있습니다.
set
접근자:
set
키워드를 사용하여 객체의 프로퍼티에 값을 설정할 때 해당 프로퍼티 값을 처리하는 메서드를 정의합니다. set
접근자를 사용하면 프로퍼티에 값을 설정할 때마다 추가적인 동작을 수행할 수 있습니다.
enumerable
속성:
enumerable
속성은 불리언 값(true 또는 false)으로, 프로퍼티가 열거 가능한지를 나타냅니다. 열거 가능한 프로퍼티는 for...in
루프나 Object.keys()
메서드 등을 통해 객체의 프로퍼티를 순회할 때 포함됩니다.
configurable
속성:
configurable
속성은 불리언 값(true 또는 false)으로, 프로퍼티가 변경 가능한지를 나타냅니다. 변경 가능한 프로퍼티는 delete
연산자를 통해 삭제하거나, 접근자 프로퍼티를 재정의할 수 있습니다.
이제 코드 예시를 통해 자세히 살펴보겠습니다.
// 객체 생성
const person = {
firstName: 'John',
lastName: 'Doe',
// getter 접근자 정의
get fullName() {
return this.firstName + ' ' + this.lastName;
},
// setter 접근자 정의
set fullName(name) {
const [firstName, lastName] = name.split(' ');
this.firstName = firstName;
this.lastName = lastName;
},
};
// getter 접근자 사용
console.log(person.fullName); // 출력: "John Doe"
// setter 접근자 사용
person.fullName = "Alice Smith";
console.log(person.firstName); // 출력: "Alice"
console.log(person.lastName); // 출력: "Smith"
위의 코드에서 fullName
은 접근자 프로퍼티로 정의되어 있습니다. get
접근자는 fullName
에 접근할 때 해당 함수를 실행하여 firstName
과 lastName
을 합친 전체 이름을 반환합니다. set
접근자는 fullName
에 값을 설정할 때 호출되며, 입력된 이름을 공백을 기준으로 firstName
과 lastName
으로 분리하여 객체의 프로퍼티에 설정합니다.
또한, 접근자 프로퍼티의 enumerable
과 configurable
속성을 설정하지 않았기 때문에 기본값인 true
가 적용되어 열거 가능하고 변경 가능한 프로퍼티입니다. 이를 사용자 정의로 변경하려면 Object.defineProperty()
메서드를 사용할 수 있습니다.
글이 많은 도움이 되었습니다, 감사합니다.