JavaScriptオブジェクトの属性getterとsetter編

オブジェクト属性は名前と値と特性のセットから構成されることを知っています.ECMAScript 5では、属性値は一つまたは二つの方法で代替できます.この二つの方法はgetterとsetterです.getterとsetterによって定義された属性を「アクセサ属性」と呼びます.「データ属性」とは異なり、データ属性は単純な値しかありません.プログラムがアクセサ属性の値を照会すると、JavaScriptがgetterメソッドを呼び出します.この方法の戻り値は属性アクセス式の値です.プログラムがアクセサ属性の値を設定すると、JavaScriptはsetterメソッドを呼び出し、割当表現の右側の値をパラメータとしてsetterに入力します.ある意味では、この方法は「設定」属性値を担当しています.setter法は無視できますが、値は無視できます.データの属性と違い、アクセサの属性は書き込み可能性がありません.属性が一緒にgetterとsetterの方法を持っているなら、それは読み書きの属性です.もしそれがgetter法しかないなら、それは読み取り専用の属性だけです.これがsetterメソッドだけであれば、属性だけを書く(データ属性にはいくつかの例外があります)ので、書き込みのみの属性は常にundefinedに戻ります.アクセサの属性を定義する最も簡単な方法は、オブジェクトの直接量の文法を使用する拡張された書き方です.

var o = {
	//       
	data_prop: value,
	//              
	get accessor_prop() {/*      */},
	set accessor_prop(value) {/*      */}
}

アクセサ属性は、1つまたは2つの属性と同じ名前の関数として定義されています.この関数は、functionキーを使用しないで、getおよび(または)setを使用するように定義されています.ここでは、コロンを使用して属性名と関数体を分離していませんが、関数の終了と次の方法またはデータ属性の間にコンマ区切りがあります.例えば、次の2 Dデカルトポイント座標の対象を考えます.2つの一般的な属性xとyはそれぞれ対応点のX座標とY座標を表しています.また、2つの等価のアクセサ属性は点を表す極座標に用いられます.

var p = {
	//x y            
	x: 1.0,
	y: 1.0,
	//r          ，  getter setter。
	//              
	get r() { return Math.sqrt(this.x*this.x + this.y*this.y);},
	set r(newvalue) {
		var oldvalue  = Math.sqrt(this.x*this.x + this.y*this.y);
		var ratio = newvalue/oldvalue;
		this.x*= ratio;
		this.y*= ratio;
	},
	//theta        ，   getter  
	get theta() {return Math.atan2(this.y, this.x);}
}

このコードの中でgetterとsetterの中でthisキーワードの使い方に注意してください.JavaScriptはこれらの関数を対象とする方法で呼び出されます.つまり、関数内のthisはこの点を表すオブジェクトを指しています.したがって、r属性のgetter方法は、this.xとthis.yによってxとy属性を参照することができます.データ属性と同様に、アクセサ属性は継承可能であるため、上記コードのオブジェクトpを別の「点」の原型とすることができる.新しいオブジェクトにxとyの属性を定義できますが、rとthetaの属性は継承されます.

var q = Object.create(p); //      getter setter    
q.x = 1,q.y = 1;		// q      
console.log(q.r);		//            
console.log(q.theta);

このコードはアクセサ属性を使用してAPIを定義し、APIは同じグループのデータを表す2つの方法(デカルト座標系表現法と極座標系表示法)を提供する.また、多くのシーンでは、アクセス属性、例えばスマート検出属性の書き込み値、属性読み出し時に異なる値を返します.

//              
var serialnum = {
	//              
	//$               
	$n: 0,
	//     ，    
	get next() {return this.$n++;},
	// n     ，                
	set  next(n) {
		if(n >= this.$n) this.$n = n;
		else throw "           ";
	}
};

本文の大多数の文字は「JavaScript権威の手引き」から抜粋して、皆様の参考に供します.