LoginSignup
1
0

More than 5 years have passed since last update.

初心者めも

Posted at

JavaScriptでは関数は変数と変わらない。
Javaでオブジェクトを変数に入れられるのと同じように、JavaScriptでは関数を変数に入れられる。

よくある書き方

function hogefunc() {
    document.write("よくある書き方");
}
hogefunc(); /* 『よくある書き方』と表示される */

変数に代入する書式

var hogefunc2 = function() {
    document.write("変数に代入する場合と同じ書式でかく");
}
hogefunc2();/* 『変数に代入する場合と同じ書式でかく』と表示される */

unction hogeという宣言はhogeという関数入りの変数を作ったということ。

関数を戻り値で返す関数

var sotofunc = function() {

    return function() {
        document.write("関数を返す関数");
    }
}

var func = sotofunc(); /* return の横にある関数が、func変数に代入される */
func(); /* 代入された関数が実行され『関数を返す関数』が表示される */

関数が変数と同じならば、他の数値や文字列と同じように扱うことができる。
たとえば関数の戻り値を関数にする方法などが可能。

関数を引数で関数に渡す

var hogefunc3 = function(func2) {
    func2();/* 引数で渡された何かしらの変数を関数として実行する */
}
/* 関数を引数で渡す。『関数を引数で受け取る関数』と表示される */
hogefunc3(function(){ document.write("関数を引数で受け取る関数"); });

関数も変数だから、引数として関数を渡すことができる。
これの使いドコロは、あらかじめ共通部分はつくっておいて、処理部分を後から作るとかができる。

関数内で生き残る変数(クロージャ)

var hogefunc4 = function() {
    var num = 0; /* 0を持つ変数を宣言 */

    return function() {
        document.write(num);
        num++;

var clfunc = hogefunc4(); /* returnの横にある無名関数を変数に代入する */
/* numはスコープから外れているので、clfuncに代入された関数が実行後も変数は生きている */
clfunc(); /* 0と表示される */
clfunc(); /* 1と表示される */
clfunc(); /* 2と表示される */

JavaScriptでは関数を関数内に定義することができる。
ある関数が関数の外にある変数にアクセスできるが、関数内にネストされた関数でもそれはできる。

関数を返す関数hogefunc4内にnumという変数があるが、
通常numの寿命はhogefunc4が実行されている間だが、
戻り値で返される関数がnumを使っている場合numの寿命が伸びる。

戻り値で返される関数が生きている間はnumは生き続けるし、またnumは戻り値関数のスコープの外にあるから
状態が保持される。

この場合、関数を実行するたびインクリメントされる。
状態を持った関数を作ることができる。

こういうものをクロージャと呼ぶ。

1
0
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0