javascript - this.async（）はJavaScriptで何をしますか

Question

コードでこのパターンを見続けましたが、グーグルやSOでそれへの参照を見つけることができませんでした、奇妙なことです。this.async（）関数の参照を誰かに教えてもらえますか？

  var done = this.async();
  // ...
  $.get(path, function(contents) { // or some other function with callback
    // ...
    done(JST[path] = tmpl);
  })

Answer 1

var done = this.async()同期関数内で非同期呼び出し（例）からフェッチされた値をdone(blah)返す巧妙なトリックです。$.get

例を見てみましょう：

var getText = function() {
  return "hello";
};
var text = getText();

これは非常に単純な関数呼び出しなので、ここではパズルはありません。ただし、getText（）関数で非同期的にテキストをフェッチする必要がある場合はどうなりますか？

var getText = function() {
  return $.get('<some-url>', function(text) {
    return text;
  });  // ??????
};

を呼び出すとgetText()、取得したいテキストが返されません。jqueryのpromiseオブジェクトを返します。

では、呼び出しgetText()から取得したテキストをどのように返すのでしょうか。$.get()

var getText = function() {
  var done = this.async();
  $.get('<some-url>', function(text) {
    done(text);
  });
};
var text = getText();  // you get the expected text

魔法だよね？

this.async()通話の内部動作はまだわかりません。その機能を提供するライブラリがあるかどうかはわかりませんが、Backbone.LayoutManagerがこのトリックを使用していることがわかりますhttps://github.com/tbranyen/backbone.layoutmanager/blob/master/backbone.layoutmanager.js（検索this.asyncの場合）。

また、Tim Branyen（バックボーンlayoutmanagerの作成者）は、彼のビデオチュートリアル（http://vimeo.com/32765088 14：00〜15：00頃）で簡単に説明しています。ビデオの中で、ティムはベンアルマンがそのトリックを思いついたと言います。これも見てくださいhttps://github.com/cowboy/javascript-sync-async-foreach

非同期機能と同期機能を組み合わせるのはかなり巧妙なトリックだと思います。

乾杯、

Answer 2

var done = this.async()タスク内で非同期機能を実行するためにGruntで使用されるパターンです。

タスクを呼び出すdone()かdone(returnValues)、Gruntにタスクが完了したことを通知する必要があります（非同期タスクのチェーンの後）。

詳細については、 https ：//gruntjs.com/inside-tasks#inside-all-tasksをご覧ください。

Answer 3

thisこれは、コールバック内でのエスケープの問題を回避する方法です。この追加の参照がないと、コードは次のようになります。

$.get(path, function(contents) { // or some other function with callback
  //Wrong! `this` might no longer point to your object
  this.done(JST[path] = tmpl);
})

不運にも！内部応答コールバックは、外部とthis同じではありません。実際、 （を使用してコールバックを呼び出す）this何が決定するかに応じて、何でもかまいません。$.getほとんどの人はthat、同じ目的で名前が付けられた追加の参照を使用します。

var that = this;
// ...
$.get(path, function(contents) { // or some other function with callback
  // ...
  that.async(JST[path] = tmpl);
})

このパターンも合理的で読みやすいようです。

ああ、そしてこの構文に興味があるなら：

done(JST[path] = tmpl)

これは、式として使用される割り当てです。割り当ての値は右側であるため、このコードは次のようになります。

JST[path] = tmpl;
done(tmpl);