Changes between Version 3 and Version 4 of HowTo/JavaScriptLanguageIntroduction/ValueAndVariable


Ignore:
Timestamp:
Aug 5, 2010, 3:00:53 PM (14 years ago)
Author:
村山 俊之
Comment:

--

Legend:

Unmodified
Added
Removed
Modified
  • HowTo/JavaScriptLanguageIntroduction/ValueAndVariable

    v3 v4  
    105105}}}
    106106
     107=== 関数 ===
     108
     109関数は値である、といわれても、感覚的にはぴんと来ないかも知れません。しかし、関数を変数に代入しておいたり、関数の処理内容を動的に作り出したりできる仕組みは、慣れるとなかなかに便利なものです。
     110
     111まず、 function 宣言によって定義された関数は、そのままその名前の変数として振る舞います。
     112
     113{{{
     114function a() { /* 処理... */ }
     115
     116var b = a;  // 変数 b に関数 a を代入
     117}}}
     118
     119このとき、以下のように記述することで、変数 b から関数を実行することができます。
     120
     121{{{
     122b();    // a(); と等価の処理を実行する
     123}}}
     124
     125なお、一度定義した関数の処理内容を直接変更することはできません。別の関数を代入して上書きすることはできますが…。
     126
     127名前をつけてちゃんと定義した関数ではなく、無名の関数をその場で変数に代入することもできます。
     128
     129{{{
     130var c = function() { /* 処理... */ };
     131
     132c();    // もちろん、こう書けば処理を実行できる
     133}}}
     134
     135このような関数定義の書き方は'''無名関数'''などと呼ばれたりしています。
     136
     137関数呼び出しの前に '''new''' 命令を挿入すると、その関数をコンストラクタとしたオブジェクトの生成ができるのですが (詳細は後ほど…)、無名関数でもオブジェクトの生成はもちろん可能です。
     138
     139{{{
     140var X = function() {
     141    this.name = "unknown";
     142    this.mask = "secret";
     143};
     144
     145var x = new X();    // オブジェクト生成
     146
     147var y = new (function() { /* ... */ })();   // こんな書き方も一応可能
     148}}}
     149
     150=== オブジェクト ===
     151
     152!JavaScript はオブジェクト指向的な性格の強い言語ですので、未定義値を除くすべての型で、その値にオブジェクトとしての性格を持っています。例えば数値型の値には toFixed() メソッドを適用することで、指定した精度の少数を表す文字列を得ることができますし、
     153
     154{{{
     155var root2 = 1.41421356;
     156alert(root2.toFixed(3));    // "1.414" と表示
     157}}}
     158
     159文字列型の値には substr() メソッドを適用することで、指定した位置の文字列を切り出すことができたりします。
     160
     161{{{
     162var text = "Hello World.";
     163alert(text.substr(6, 5));   // "World" と表示
     164}}}
     165
     166しかし、より自由に、プログラム側から'''メンバ'''に新しい値を代入し、それをメンバフィールドやメンバメソッドとして活用することのできる型は、2種類しか存在しません。ひとつは関数型、そしてもう一つがオブジェクト型です。
     167
     168オブジェクト型の値を生成する方法は以下の 2通りです。
     169
     170{{{
     171var a = {
     172    "foo": 1,
     173    "bar": "hoge",
     174    "baz": true,
     175    "showAll": function() { alert("foo: " + this.foo + ", bar: " + this.bar + ", baz: " + this.baz); }
     176};
     177var b = new Object();
     178}}}
     179
     180変数 a に代入している方は、最も手軽にオブジェクト型の値を生成する方法です。全体をブレース "{" ~ "}" でくくり、「"メンバ名": 値」の組み合わせをカンマ "," で区切って記述します。すると、指定したメンバ名の値を持つオブジェクトが生成されます。
     181
     182変数 b に代入している方は、関数呼び出しをコンストラクタとして利用することにより、オブジェクトを生成する方法です。 "Object" というのは、実は !JavaScript に最初から定義されている関数名ですが、自分で定義した関数をコンストラクタに用いることももちろんできます。
     183
     184{{{
     185// コンストラクタ
     186function X() {
     187    this.foo = 1;
     188    this.bar = "hoge";
     189    this.baz = true;
     190    this.showAll = function() {
     191        alert("foo: " + this.foo + ", bar: " + this.bar + ", baz: " + this.baz);
     192    };
     193}
     194
     195// オブジェクトを生成
     196var x = new X();
     197}}}
     198
     199ここで、変数 x に代入されたオブジェクトと、先ほどの例で変数 a に代入されたオブジェクトは、内容的には等価です。オブジェクトのメンバには、ドット "." に続いてメンバ名を指定することにより参照することができます。
     200
     201{{{
     202alert(a.foo);   // "1" を表示
     203alert(a.bar);   // "hoge" を表示
     204alert(a.baz);   // "true" を表示
     205a.showAll();    // "foo: 1, bar: hoge, baz: true" を表示
     206
     207alert(x.foo);   // "1" を表示
     208alert(x.bar);   // "hoge" を表示
     209alert(x.baz);   // "true" を表示
     210x.showAll();    // "foo: 1, bar: hoge, baz: true" を表示
     211}}}