Object.defineProperties( object, descriptors )メソッド

投稿日: 2013年6月5日 作成者: alphasis

Object.defineProperties( object, descriptors )メソッドは、オブジェクトに複数のプロパティを追加したり、複数の既存プロパティを変更したりできるメソッド。

既存プロパティを変更する際は、既存プロパティのconfigurable属性が「true」になっていなければならない。

既存プロパティの値を変更する際は、既存プロパティのwritable属性かconfigurable属性のいずれかが「true」になっていなければならない。

構文

Object.defineProperties( object, descriptors )

引数

object
プロパティを追加したり変更したりしたいオブジェクトを指定。
descriptors
プロパティ名やプロパティの属性を、
{ "プロパティ名":
    {
        value: "値",
        writable: true
    }
}
のように、オブジェクトリテラル表記で指定する。
プロパティのディスクリプタ（enumerable属性、configurable属性）、データディスクリプタ（value属性、writable属性）、アクセサディスクリプタ（get属性、set属性）を指定できる。データディスクリプタとアクセサディスクリプタは、同時には使えない。
value属性（値属性）
プロパティの値。
初期設定値は「undefined」。
writable属性（書き込み属性）
プロパティの値の変更を許可するか。
「true」を指定すると値を変更できる。「false」を指定すると値を変更できない。
初期設定値は「false」。
enumerable属性（可算属性）
オブジェクトをfor文で展開する際に、このプロパティを含めるか。
「true」を指定すると、オブジェクトをfor文で展開する際に、このプロパティを含める。列挙可能。
「false」を指定すると、オブジェクトをfor文で展開する際に、このプロパティを含めない。列挙不能。
初期設定値は「false」。
configurable属性（設定属性）
このプロパティの削除や、上記属性値の変更を許可するか。
「true」を指定すると、プロパティ削除や、属性値の変更ができる。「false」を指定すると、プロパティ削除や、属性値の変更ができない。
初期設定値は「false」。
get属性（値属性）
プロパティの値を返す関数。
初期設定値は「undefined」。
set属性（値属性）
プロパティの値を設定する関数。
初期設定値は「undefined」。

戻り値

変更後のオブジェクト。

サンプル

データディスクリプタ

value属性とwritable属性のデータディスクリプタを使ったサンプル。

<script type="text/javascript">

var $sampleObjectA = Object.create(
    null,
    {
        $samplePropA: {
            value : 'サンプルＡ',
                // プロパティの値を設定。
            writable : true,
            enumerable : true,
                // enumerable属性に「true」を指定すると、
                // オブジェクトをfor文で展開する際に、このプロパティを含める。
                // 列挙可能。
        },
        $samplePropB: {
            value : 'サンプルＢ',
                // プロパティの値を設定。
            enumerable : true,
                // enumerable属性に「true」を指定すると、
                // オブジェクトをfor文で展開する際に、このプロパティを含める。
                // 列挙可能。
        },
    }
);

document.write( '$sampleObjectA.$samplePropA：' + $sampleObjectA.$samplePropA + '<br />' );
document.write( '$sampleObjectA.$samplePropB：' + $sampleObjectA.$samplePropB + '<br />' );

document.write( '<br />for文で展開<br />' );
for( var $sampleProp in $sampleObjectA ) {
   document.write( '$sampleProp：' + $sampleProp + '<br />' );
}

document.write( '<br />Object.definePropertiesで変更及び追加<br />' );
Object.defineProperties(
    $sampleObjectA,
    {
        '$samplePropA' : {
            value : 'さんぷる①',
                // プロパティの値を設定。
        },
        '$samplePropC' : {
            value : 'さんぷる③',
                // プロパティの値を設定。
            enumerable : true,
                // enumerable属性に「true」を指定すると、
                // オブジェクトをfor文で展開する際に、このプロパティを含める。
                // 列挙可能。
        }
    }
);

document.write( '$sampleObjectA.$samplePropA：' + $sampleObjectA.$samplePropA + '<br />' );
document.write( '$sampleObjectA.$samplePropB：' + $sampleObjectA.$samplePropB + '<br />' );
document.write( '$sampleObjectA.$samplePropC：' + $sampleObjectA.$samplePropC + '<br />' );

document.write( '<br />for文で展開<br />' );
for( var $sampleProp in $sampleObjectA ) {
   document.write( '$sampleProp：' + $sampleProp + '<br />' );
}

</script>

↓↓↓出力結果↓↓↓

アクセサディスクリプタ

get属性とset属性のアクセサディスクリプタを使ったサンプル。

<script type="text/javascript">

var $samplePropValueA = 'サンプルＡ';
var $samplePropValueB = 'サンプルＢ';
var $sampleObjectB = Object.create(
    null,
    {
        $samplePropA: {
            get : function() { return $samplePropValueA; },
                // プロパティの値を返す関数を設定。
            set : function( $newValue ) { $samplePropValueA = $newValue; },
                // プロパティの値を関数で設定。
            enumerable : true,
                // enumerable属性に「true」を指定すると、
                // オブジェクトをfor文で展開する際に、このプロパティを含める。
                // 列挙可能。
            configurable : true,
        },
        $samplePropB: {
            get : function() { return $samplePropValueB; },
                // プロパティの値を返す関数を設定。
            enumerable : true,
                // enumerable属性に「true」を指定すると、
                // オブジェクトをfor文で展開する際に、このプロパティを含める。
                // 列挙可能。
            configurable : true,
        },
    }
);

document.write( '$sampleObjectB.$samplePropA：' + $sampleObjectB.$samplePropA + '<br />' );
document.write( '$sampleObjectB.$samplePropB：' + $sampleObjectB.$samplePropB + '<br />' );

document.write( '<br />for文で展開<br />' );
for( var $sampleProp in $sampleObjectB ) {
   document.write( '$sampleProp：' + $sampleProp + '<br />' );
}

document.write( '<br />Object.definePropertiesで変更及び追加<br />' );
Object.defineProperties(
    $sampleObjectB,
    {
        '$samplePropA' : {
            get : function(){ return 'さんぷる①'; },
                // プロパティの値を返す関数を設定。
            enumerable : false,
                // enumerable属性に「false」を指定すると、
                // オブジェクトをfor文で展開する際に、このプロパティを含めない。
                // 列挙不能。
        },
        '$samplePropC' : {
            get : function(){ return 'さんぷる③'; },
                // プロパティの値を返す関数を設定。
            enumerable : true,
                // enumerable属性に「true」を指定すると、
                // オブジェクトをfor文で展開する際に、このプロパティを含める。
                // 列挙可能。
        }
    }
);

document.write( '$sampleObjectB.$samplePropA：' + $sampleObjectB.$samplePropA + '<br />' );
document.write( '$sampleObjectB.$samplePropB：' + $sampleObjectB.$samplePropB + '<br />' );
document.write( '$sampleObjectB.$samplePropC：' + $sampleObjectB.$samplePropC + '<br />' );

document.write( '<br />for文で展開<br />' );
for( var $sampleProp in $sampleObjectB ) {
   document.write( '$sampleProp：' + $sampleProp + '<br />' );
}

</script>

↓↓↓出力結果↓↓↓

スポンサード リンク

カテゴリー: JavaScript, Objectオブジェクト, メソッド, リファレンス, 組み込みオブジェクト タグ: パーマリンク