Javascriptの基本:いろいろな関数

先のログ『Javascriptの基本:代入式』では、

var test = function(){ // --(2)
    var _arr = ["pretty","print"];
    return _arr;
};

var v1 = test; // --- (1) 参照の代入
var v2 = test(); // --- (3) 参照する関数の実行

の例を用いて、以下の結果を得た(参照は「参照アドレス(ポインタ)」の略)。

  1. 「関数名」での代入は、その関数への参照の代入を意味する。(v1)
  2. 「関数名()」での代入は、その関数の実行結果(正確には、「関数名」が参照する関数を実行させた結果)の代入を意味する。(v2)

これを、平たく言えば、

(関数を指す)参照に()を付ければ、関数が実行される

ということになる。

とはいえ、

var v3 = 1; // --- (4)
v3();       // --- (5) むやみに()をつけてもエラーとなる。

のように、関数でない変数に()をつけても「関数じゃないよ」とパースエラーが起こる。

Javascriptの関数の中には「変な格好」の関数がいろいろあるが、上の理解に立てば、大抵を理解することができる(と思う)。以下に幾つかの例を挙げる。

関数を引数にとる関数

<例>

var test2 = function(_fn){ // --- (6) 関数を引数にとる関数
    _fn();	// --- (7)
}

var al1 = function(){ // --- (8)
    alert('hello_1');
}

test2(al1); // --- (9) (8)の参照を渡して、(6)を実行

(6)式の関数は、「関数への参照」を引数にとって、(7)式で実行するというもの。
(8)式の関数は、(6)式を実験するために用意した。
(9)式で、test2を実行している。「参照渡し」のサンプルとなっている。

関数を戻り値にする関数

<例>

>|javascript|

var test2 = function(_fn){ // --- (6) 関数を引数にとる関数
    _fn();	// --- (7)
}

var al2 = function(){ // --- (10)
	return function(){ // --- (11)
		alert('hello_2');
	};
}

test2(al2()); // --- (12) (10)を実行して(11)の参照を得て、(6)を実行

(10)式は、関数(11)を戻り値にする関数の例(実際には、関数(11)への参照が戻る)。
(12)式で、al2()として関数(11)への参照を取得し、先の例で使用した(6)式で実行する。

即時実行する関数

<例>

var al2 = function(){ // --- (10)
	return function(){ // --- (11)
		alert('hello_2');
	};
}

(al2())(); // --- (13) (10)を実行して(11)の参照を得て実行。
(function(){alert('hello_2');})(); // --- (14) (13)と等価。

(13)式では、先の例で使った(10)を実行して、(11)式への参照を取得し、()を付けて実行している。
(14)式は、(13)式でal2()(すなわち、(11)式への参照)となっているところを、(11)式でそのまま入れ替えている。(13)式と等価な関数であるが、「即時実行される関数」となる。