JavaScriptパターン 第4章

一週間近く放置していたJavaScriptパターンを読んだのでその記録を。この本、薄いのに内容が難しくて後半は何を言っているのかさっぱり。

名前付き関数式

変数に関数を代入する場合、多くは

var a = function () {
};

と書く事が多いと思いますが、

var a = function a() {
};

なんて書き方もOKだそうで。後者の書き方だと、この関数のnameプロパティに関数名が入ります。
ただまあ、nameプロパティはECMAScript標準ではないみたいですが……

関数の巻き上げ

……まあこんなコード書く人は少ないとは思いますが。

function a() {
  console.log("a");
}

function b() {
  a();
  function a() {
    console.log("b - a");
  }
}

b(); // "b - a"

いやー、うっかり同じ関数名で関数を作ってしまって、それが原因で不具合を作ったりしていたら嫌ですねえ。

call(), apply()

var pallet = {
  color: "blue"
};

function writeColor() {
  console.log(this.color);
}

writeColor.call(pallet, null);  // "blue"

call(), apply() は1番目の引数をthisにしてその関数を呼びます。
2つの違いはcall()が第2引数以降をコンマで区切って渡し、apply()が第2引数に配列として渡すところ。

var a = {
  b: function() {
    console.log(this.c);
  },
  c: "// a.c //"
};

var d = {
  c: ":: d.c ::"
};

a.b();  // "// a.c //"
a.b.call(d, null);  // ":: d.c ::"

き、きもちわる…… 柔軟というか、なんというか……

自己定義関数

自分を定義し直す、って解釈でいいのかな?

var a = function() {
  console.log("1st");
  a = function() {
    console.log("2nd");
  };
};

a();  // "1st"
a();  // "2nd"

うーん、どこで使うんだろう……

即時関数

(function(){
})();

(function(){
}());

下の書き方でもOKだったのかー。知らなかった。
あと最近知った書き方が

new function() {
};

で、最近はこればかり書いてます。どれが一番いいんだろう。本では2番目を勧めてたけど。変わらないなら一番下がいいな。

即時オブジェクト初期化

({
  a: 1,
  b: 2,
  init: function() {
    console.log("init");
  }
}).init();

一回きりの処理で、オブジェクトへの参照が発生しない場合に有効って…… そんなにあるかなあ。

({ /* いろいろ */ }).init();
({ /* いろいろ */ }.init());

宣言(実行?)は上記のどちらでも同じだとか。

部分適用

読み直してたらわかった!でもカリー化はさっぱり……

function a(b, c) {
  var b_ = b, c_ = c;
  // cが渡されなかったら
  if (typeof c_ === "undefined") {
    // 引数を1つ受け取ってbと足し算をして返す関数を返す
    return function (_c) {
      return b_ + _c;
    };
  }
  // 引数が2つ渡されたら足し算をして返す
  return b + c;
}

var q = a(3);  // function(_c) { ... }
q(3);  // 6

var e = a(1,2);  // 3

これ、どこで使うの……?


関数、奥が深い。