オブジェクトのプロパティは主に「データプロパティ」と「アクセサプロパティ」の2つに分類されます。アクセサとは、オブジェクトのプロパティに対して外部からアクセスするメソッドのことです。
スポンサーリンク
値を格納するためのデータプロパティに対して、アクセサプロパティは値を持ちません。アクセサプロパティは、プロパティを読み書きする際の処理を自分で指定することができます。プロパティの読み込み時の処理にはゲッター関数(getter)を、書き込み時の処理にはセッター関数(setter)を利用します。
関連ページ
オブジェクトについて[オブジェクトリテラル][プロパティ][メソッド]
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
var square = { _side:3, get area(){ return Math.pow(this._side,2); //3×3 }, set area(value){ this._side = value; } }; console.log(square.area); //9 square.area = 5; console.log(square.area); //25 |
2行目
データプロパティである_sideに3を入力しています。アクセサプロパティは自身ではプロパティの値を持たないため上記の例ではこの_sideを利用しています。オブジェクト内ではthisキーワードを利用してthis._sideのように指定し利用できます。
関連ページ
4〜6行目
ゲッター関数を利用し、読み出し(参照)可能なareaという名前のアクセサプロパティを生成しています。ゲッターには戻り値(return)が必要となります。13行目で実際に呼び出していますが、もしゲッターを用意せずにアクセサプロパティを呼び出そうとした場合、undefinedとなります(strictモードではエラーとなります)。ゲッターを利用して加工したデータを参照するなどの処理が行えます。
8〜10行目
セッター関数を利用し、areaプロパティを書き込みできるようにしています。セッターは引数を1つ持ちます。セッターの中で引数の値が妥当であるかなどの処理も行えます。
下記ではset関数を定義せずに、11行目においてareaプロパティに対して値を書き込もうとしています。Strictモードの場合はエラーとなります。
1 2 3 4 5 6 7 8 9 10 11 12 |
"use strict"; var square = { _side:3, get area(){ return Math.pow(this._side,2); //3×3 } }; square.area = 5; console.log(square.area); //エラーとなる |
関連ページ
これまでの説明では、データプロパティである_sideに対して外部から変更可能なので、クロージャを利用して関数内に変数を閉じ込めることも可能です。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
var square =(function(){ var _side = 3; return { get area(){ return Math.pow(_side,2); //3×3 }, set area(value){ _side = value; } }; })(); console.log(square.area); //9 square.area = 5; console.log(square.area); //25 |
参照文献