기존의 객체에 사용되던 프로퍼티는 데이터 프로퍼티라고 함.
접근자 프로퍼티 :getter
,setter
함수라고도 부름.
👉 스스로는 값을 갖지 않으며 다른 프로퍼티의 값을 읽거나 저장할 때 사용함
👉get
,set
을 앞에 붙여서 사용함
const person1 = {
age: 17,
get koreanAge () {
return this.age + 1;
},
set koreanAge (krAge) {
this.age = krAge - 1;
}
}
함수처럼 지정되었으나 프로퍼티처럼 사용함
클래스에서도 사용 가능함
class YalcoChicken {
constructor (name, no) {
this.name = name;
this.no = no;
}
get chainTitle() {
return `${this.no}호 ${this.name}점`;
}
set chainNo(chainNo) {
if (typeof chainNo !== 'number') return;
if (chainNo <= 0) return;
this.no = chainNo;
}
}
const chain1 = new YalcoChicken('판교', 3);
console.log(chain1.chainTitle);
chain1.chainNo = 4;
console.log(chain1);
getter
: 반드시 값을 반환해야 함, 특정 프로퍼티를 원하는 방식으로 가공하여 내보냄
setter
: 하나의 인자를 받음, 특정 프로퍼티 값이 지정되는 방식을 조작하거나 제한함
캡술화 encapsulation
- 객체지향의 주요 요소 중 하나 - 객체 내부의 값을 감추는(은닉) 것
- 인스턴스의 프로퍼티 값을 함부로 열람하거나 수정하지 못하도록
- 자바스크립트의 필드는 기본적으로 public (은닉되지 않음)
class Employee {
#name = '';
#age = 0;
constructor (name, age) {
this.#name = name;
this.#age = age;
}
}
const emp1 = new Employee('김복동', 32);
console.log(emp1.#name); // ⚠️ 오류 발생 (일부 브라우저 제외)
console.log(emp1['#name']); // ⚠️ undefined 반환
class Employee {
#name = '';
#age = 0;
constructor (name, age) {
this.#name = name;
this.#age = age;
}
get name () {
// [n]: n + 1 번째 글자를 반환
return this.#name[0] + '모씨';
}
get age () {
return this.#age - (this.#age % 10) + '대';
}
set age (age) {
if (typeof age === 'number' && age > 0) {
this.#age = age;
};
}
getOlder(years) { this.#age += years; }
}
const emp1 = new Employee('김복동', 22);
console.log(emp1.name, emp1.age); // 김모씨 20대