19

私はここで、非同期 JavaScript の作成を理解するのに本当に苦労しています。プレーンな JavaScript で記述された (Node.js や JQuery を使用していない) 非同期の単純な JavaScript 関数の例を教えてください。

4

3 に答える 3

32

JavaScript 自体は同期でシングルスレッドです。非同期関数を作成することはできません。プレーン JS にはタイミング API がありません。並列スレッドによる副作用はありません。

requestAnimationFrameできることは、タイムアウト、ajax、FileAPI 、、、nextTickWebWorkers、DOM イベントなどを使用して、非同期タスクをスケジュールできる環境 (Node.js、Web ブラウザー) によって提供されるいくつかの API を使用することです。

使用例setTimeout( HTML Timing APIで提供):

window.setTimeout(function() {
    console.log("World");
}, 1000);
console.log("Hello");

更新: ES6 以降、プレーンな JavaScript に組み込まれた非同期プリミティブとしての約束があるため、次のことができます。

 Promise.resolve("World").then(console.log); // then callbacks are always asynchronous
 console.log("Hello");

ただし、待機できるものが何もない場合 (タイムアウトなど) は、単独ではあまり役に立ちません。また、スレッド モデルについても何も変更されていません。すべての実行は、イベントが途中で干渉することなく完了まで実行されます。

于 2012-12-10T18:20:56.707 に答える
8

これは非同期です:

setTimeout(function(){
   console.log('1');
}, 2000);

console.log('2');

2 は 1 の前にコンソールに書き込まれます。setTimeout は非同期であるためです。

于 2012-12-10T18:18:01.657 に答える
7

非常に簡単な例を次に示します。

for (var i = 0; i < 10; i++) {
  window.setTimeout(function() {
    console.log(i);
  }, 2000);
}

次のスニペットのように、これらのconsole.log()呼び出しが表示されることを期待するかもしれません。0, 1, 2

for (var i = 0; i < 10; i++) {
  console.log(i);
}

しかし、実際には10s だけが出力されます! setTimeoutfunction に ('callback' 引数として)渡された関数が、ループが完了した後、つまり値が 10 に設定された後に呼び出される理由。 fori

ただし、1 つのことを理解しておく必要があります。ブラウザー内のすべての JavaScript は単一のスレッドで実行されます。非同期イベント (マウス クリックやタイマーなど) は、実行キューに空きがある場合にのみ実行されます。これは、このトピックについて John Resig が書いたすばらしい記事です。

于 2012-12-10T18:18:02.827 に答える