angularjsの$timeoutに指定するfunctionについて

Question

例1

$timeout(function() {
  ・・・
}, 200)

例２

var some_func = function() {
  ・・・
}
$timeout(function() {
  some_func();
}, 200)

例3

var some_func = function() {
  ・・・
}
$timeout(some_func, 200)

上の3つのコードは同じ意味となるでしょうか？
私は同じ認識でいるのですが、例3だけ意図した動きにならないことがあります。。

Comments

[tkturbo]

「例3だけ意図した動きにならない」←そういう事例も記載してみてください。

Answer 1

例3だけ意図した動きにならないことがあります

詳細が分からないのでヤマカンですが、
例3は同じスコープから持って来てるのでアレですが、
別の場所に束縛した関数とかだと変な動きすることがありますね。

仮引数として束縛してはいかが？
JavaScriptは関数は第一級オブジェクトなので、関数の引数に設定したり、戻り値として返す事が出来ます。

var fn = function (num) {
  return function () {
    return num * 2;
  }
}
var toSix = fn(3);
console.log(toSix());
// 6

console.log(toSix(10));
// 6 <- 帰ってきた関数はnum=3と束縛済みなので引数を変えても無駄

console.log(fn(2)());
// 4 <- 普通に使おうとした時はキモくなる、何とかならんか？

console.log(toSix);
// ƒ () { return num * 2; }

関数を返す関数は仕組みが分かってる時は便利ですが、
パッと見せられたり普通に使う場面では相当キモいですね。
なんとかならんか？こういう目的の為に

// 今回は普通に値を返す関数だ
var fn = function (num) {
  return num * 2;
}
var toSix = fn.bind(null, 3);
console.log(toSix());
// 6

console.log(toSix(10));
// 6 <- 帰ってきた関数はnum=3と束縛済みなので引数を変えても無駄

console.log(fn(2));
// 4 <- 普通の関数として宣言したので普通に使う事も可能

---

恐らく例3で困るのはthisだと思うので、thisを束縛してあげましょう。
これを利用するとこんな感じの解決になります。

var fn = function (self) {
  // thisではなく、selfを利用する
}
setTimeout(fn.bind(null, this), 200);

まぁ、bindの第一引数はthisそのものの束縛なので、こう書いても多分意図通りになるかと思います。

var fn = function () {
  // thisを使った処理
}
setTimeout(fn.bind(this), 200);