접근자 프로퍼티(Accessor Property)는 JavaScript에서 getter와 setter 함수를 구현할 때 사용되는 강력한 기능입니다. 일반적인 데이터 프로퍼티와 달리, 접근자 프로퍼티는 값을 읽거나 설정하는 순간 지정된 함수가 실행됩니다. 이를 통해 객체 내부 로직을 캡슐화하면서도 직관적인 문법으로 값을 다룰 수 있습니다.
접근자 프로퍼티의 4가지 속성
접근자 프로퍼티는 다음과 같은 네 가지 속성(attribute)을 가집니다.
- get – 프로퍼티를 읽을 때 호출되는 함수입니다. 인자는 받지 않으며, 반환값이 곧 프로퍼티 값이 됩니다.
- set – 프로퍼티에 값을 할당할 때 호출되는 함수입니다. 단 하나의 인자(할당하려는 값)만 받습니다.
- enumerable –
true로 설정하면 해당 객체를 반복(iteration)할 때 이 프로퍼티가 포함됩니다. - configurable –
false로 설정하면 해당 프로퍼티를 삭제하거나 속성 값을 변경할 수 없게 되어 보호 기능을 제공합니다.
예제 코드
아래는 접근자 프로퍼티와 그 속성을 실제로 활용한 전체 코드 예제입니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
body {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.result {
font-size: 20px;
font-weight: 500;
color: blueviolet;
}
</style>
</head>
<body>
<h1>Accessor property and its attributes</h1>
<div class="result"></div>
<br />
<button class="Btn">CLICK HERE</button>
<h3>Click on the above button to use set and get to modify and display person object properties</h3>
<script>
let resEle = document.querySelector(".result");
let BtnEle = document.querySelector(".Btn");
let person = {
name: "Rohan",
age: 22,
occupation: "Student",
get fullname() {
return this.name;
},
set job(occupation) {
this.occupation = occupation;
},
};
BtnEle.addEventListener("click", () => {
resEle.innerHTML =
"Name = " + person.fullname + " : Occupation = " + person.occupation;
resEl.innerHTML += "<br>After modifying occupation property <br>";
person.occupation = "Developer";
resEle.innerHTML += "New Occupation = " + person.occupation;
});
</script>
</body>
</html>실행 결과
위 코드를 실행하면 화면에는 'CLICK HERE' 버튼과 안내 문구가 표시됩니다.
버튼을 클릭하기 전 화면:
'CLICK HERE' 버튼을 클릭하면 getter(fullname)를 통해 이름이 조회되고, setter를 통해 직업(occupation) 값이 'Developer'로 변경된 결과가 화면에 출력됩니다.
핵심 정리
접근자 프로퍼티를 활용하면 객체의 내부 상태를 외부에서 직접 수정하지 못하게 하면서, 필요한 검증 로직이나 변환 처리를 getter/setter 안에 캡슐화할 수 있습니다. 특히 enumerable과 configurable 속성을 적절히 조합하면 객체 프로퍼티의 노출 범위와 변경 가능 여부를 세밀하게 제어할 수 있어, 견고하고 유지보수하기 좋은 코드를 작성하는 데 큰 도움이 됩니다.