オブジェクトリテラルの入れ子

JavaScriptのオブジェクトリテラルは、入れ子にすることもできる。

構文

{
    プロパティA: 値A,
    プロパティB: {
        プロパティB1: 値B1,
        プロパティB2: 値B2,
        プロパティB3: 値B3
    }
}

これを変数に代入することで、オブジェクトのインスタンスを作成できる。

サンプル

<script type="text/javascript">
var $personalData = { // オブジェクトのインスタンスを作成
    $attendanceNumbere : 130213, // プロパティを定義
    $name : '日本太郎', // プロパティを定義
    $sansuu : { // メソッドを定義
        $keisan : 95, // 入れ子のプロパティを定義
        $zukei : 82, // 入れ子のプロパティを定義
    },
    $kokugo : { // メソッドを定義
        $hiragana : 100, // 入れ子のプロパティを定義
        $katakana : 60, // 入れ子のプロパティを定義
        $kanji : 76, // 入れ子のプロパティを定義
    }
};
document.write( '<ul>' );
    document.write( '<li>出席番号:' + $personalData.$attendanceNumbere + '</li>' );
    document.write( '<li>名前:' + $personalData.$name + '</li>' );
    document.write( '<li>算数' );
        document.write( '<ul>' );
            document.write( '<li>計算:' + $personalData.$sansuu.$keisan + '</li>' );
            document.write( '<li>図形:' + $personalData.$sansuu.$zukei + '</li>' );
        document.write( '</ul>\n' );
    document.write( '</li>\n' );
    document.write( '<li>国語' );
        document.write( '<ul>' );
            document.write( '<li>ひらがな:' + $personalData.$kokugo.$hiragana + '</li>' );
            document.write( '<li>かたかな:' + $personalData.$kokugo.$katakana + '</li>' );
            document.write( '<li>漢字:' + $personalData.$kokugo.$kanji + '</li>' );
        document.write( '</ul>\n' );
    document.write( '</li>\n' );
document.write( '</ul>\n' );
</script>

↓↓↓出力結果↓↓↓

スポンサード リンク

カテゴリー: JavaScript, オブジェクトリテラル, リテラル, リファレンス パーマリンク