[Javascript/ES6+] getter, setter

출처

자바스크립트 ES6+ 기본 - 인프런 | 강의

 

---

 

🚀 getter, setter

 

1) getter

[코드 1: ES5 getter의 형태]
var book = {};
Object.defineProperty(book, "title", {
    get: function() {
        return "책";
    }
});
console.log(book.title);

[실행결과]

책

 

[코드 2: ES6 getter의 형태]
// ES5 처럼 프로퍼티의 속성 구조가 아니다.
// 다수의 getter를 사용할 수 있다.
var book = {
    point: 100,
    get getPoint() {
        return this.point;
    },
    get getPointFormat() {
        return this.point + "점";
    }
};
console.log(book.getPoint);

 

[실행결과]

100

---

2) setter

[코드 1: ES5 setter의 형태]
var book = {title: "HTML"};
Object.defineProperty(book, "change", {
    set: function(param) {
        this.title = param;
    }
});
book.change = "자바스크립트";
console.log(book);

[실행결과]

책

 

[코드 2: ES6 setter의 형태]
// ES5 처럼 프로퍼티의 속성 구조가 아니다.
// 다수의 getter를 사용할 수 있다.
var book = {
    point: 100,
    set setPoint() {
        return this.point;
    },
    get getPointFormat() {
        return this.point + "점";
    }
};
book.setPoint = 200;
console.log(book.point);

[실행결과]

100