サーチ…
前書き
セッターとゲッターは、それらが設定/取得されたときに関数を呼び出すオブジェクトプロパティです。
備考
オブジェクトプロパティは、ゲッターと値の両方を同時に保持することはできません。ただし、オブジェクトプロパティは、セッターとゲッターの両方を同時に保持できます。
新しく作成されたオブジェクトにセッター/ゲッターを定義する
JavaScriptでは、オブジェクトリテラル構文でgetterとsetterを定義できます。ここに例があります:
var date = {
year: '2017',
month: '02',
day: '27',
get date() {
// Get the date in YYYY-MM-DD format
return `${this.year}-${this.month}-${this.day}`
},
set date(dateString) {
// Set the date from a YYYY-MM-DD formatted string
var dateRegExp = /(\d{4})-(\d{2})-(\d{2})/;
// Check that the string is correctly formatted
if (dateRegExp.test(dateString)) {
var parsedDate = dateRegExp.exec(dateString);
this.year = parsedDate[1];
this.month = parsedDate[2];
this.day = parsedDate[3];
}
else {
throw new Error('Date string must be in YYYY-MM-DD format');
}
}
};
date.date
プロパティにアクセスすると、値2017-02-27
が返されます。 date.date = '2018-01-02
を設定するとsetter関数が呼び出され、文字列を解析してdate.year = '2018'
、 date.month = '01'
、およびdate.day = '02'
ます。間違ってフォーマットされた文字列( "hello"
)を渡そうとするとエラーが発生します。
Object.definePropertyを使用したセッター/ゲッターの定義
var setValue;
var obj = {};
Object.defineProperty(obj, "objProperty", {
get: function(){
return "a value";
},
set: function(value){
setValue = value;
}
});
ES6クラスでゲッターとセッターを定義する
class Person {
constructor(firstname, lastname) {
this._firstname = firstname;
this._lastname = lastname;
}
get firstname() {
return this._firstname;
}
set firstname(name) {
this._firstname = name;
}
get lastname() {
return this._lastname;
}
set lastname(name) {
this._lastname = name;
}
}
let person = new Person('John', 'Doe');
console.log(person.firstname, person.lastname); // John Doe
person.firstname = 'Foo';
person.lastname = 'Bar';
console.log(person.firstname, person.lastname); // Foo Bar
Modified text is an extract of the original Stack Overflow Documentation
ライセンスを受けた CC BY-SA 3.0
所属していない Stack Overflow