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