JavaScriptのオブジェクトとは:ちゃんと理解してますか
JavaScriptをより深く知りたい人のための当連載もいよいよ三回目。今回はJavaScriptにおけるオブジェクトとは何か?というお話をしたいと思います。
以下のコードをみてください。JavaScriptのオブジェクトを作成した後、変数や関数を追加で代入しています。
var obj = new Object();
obj.v1 = "変数1";
obj.f1 = function() {
alert("関数1");
};
このようにJavaScriptのオブジェクトは、一度作成した後でも、変数や関数を自由に追加/削除することができます。これはJavaのように静的な片付けを持つ言語とは大きく異なる点です。
上のコードを、「ハッシュテーブルに値を格納している」のと同義だと捉えてみましょう。すると、以下のようなキーと値の対応になりますね。
-v1 => "変数1" -f2 => 無名関数
これらを参照する場合は、通常通り「.(ドット)」演算子を用いることができます。
// 変数「v1」の表示
alert(obj.v1);
// 関数「f1」の呼び出し
obj.f1();
さらに面白いのは、「[ ]」(大括弧)演算子を用いて、ハッシュテーブルの値(つまり、オブジェクトのメンバ)にアクセスすることができると言う点です。値の代入時、参照時のどちらでも「[ ]」を使うことが可能です。以下のコードをみてください。
// 「f2」と言うキーの名前で関数オブジェクトを格納
obj["f2"] = function() {
alert("関数2");
};
// ドット演算子を用いた関数呼び出し
obj.f2();
// 大括弧を用いて関数を参照して呼び出し
obj["f2"]();
ここで、「[ ]」の中には「文字列」を指定します。一番最後の行では、文字列"f2"を用いてオブジェクトから関数オブジェクトを取り出し、後ろに「()」を付けることで関数呼び出しを行っています(この文章の意味が分からない方は前回の記事を参照してください)。
どうですか?「[ ]」演算子を用いて、文字列でオブジェクトのメンバを代入/参照したりすると、「JavaScriptのオブジェクトはハッシュテーブルのようなもの」と言う言葉の意味が何となく実感できるのではないでしょうか。
そして、「文字列によってメンバを参照できる」と言うのは非常に強力な機能ですので、必ず覚えておいてください。以下のコードを実行すると何が起きるでしょうか?
var s1 = "al";
var s2 = "ert";
window[s1 + s2]("Hello, World");
まとめ
今回は、JavaScriptのオブジェクトを「ハッシュテーブルのようなもの」として捉えることができる、と言うお話でした。次回は今回の話を踏まえつつ、JavaScriptオブジェクトについてのさらに高度な話題(オブジェクトリテラルやJSON)などのお話をしたいと思います。
- 特集: JavaScriptのイロハ (17件)
- 昨日のトップ記事
- 2日前
- 3日前
- 4日前
- 5日前
- ホワイトペーパー
- 話題のタグ
動画再生耐久レース―フル充電からどれだけ耐えた?
心当たりありませんか--あなたの上司がイヤがる5つの話し方
フォームデザイン虎の巻:複数の選択肢を提供する
フォトレポート:技術サポートの悪夢
無料の「Oracle Database XE」で高速バッチ処理:実装のポイント
Firefoxで情報をカンタン・ベンリに整理する
iPhone Safari、Acidテストでは高得点でも…… Firefoxは載らないの?:WebサイトのiPhone 3G対応問題を考える(ソフト編)
WebサイトのiPhone 3G対応問題を考える(ハード編)
フォトレポート:時代を振り返る--「MS-DOS 4」のインストール
SOAと仮想化の関係は?--常に進化を続けるBEAのミドルウェア戦略
ウェブ開発の生産性はどうしたら上がる?--MODIPHI Appsで半日で作るマッシュアップサイト(1)
JailBreakついに:PwnageTool公開
プロジェクトの進行でよくある4つのトラブル
DELLが掲げる「新・仮想化アセスメントサービス」
ZDNet Japan Green IT
ZDNet Japan ホスティング特集
Techno Exchange