JavaScript の sleep() メソッドについて話しましょう

多くのプログラミング言語には sleep() や delay() などのメソッドがあり、プログラムの不安を軽減できます。次のステップに進みますが、遅らせてしばらく待ちます。ソフトウェア開発では、イベントが発生したかどうかを確認するために数分間待つなど、このような機能が必要な機能に遭遇することがあります。 JavaScript には、タスクを実行するための一定期間を設定する setTimeout() メソッドがありますが、このメソッドの記述は非常に醜く、コールバック関数が必要です:

setTimeout(function(){ alert("Hello"); }, 3000);

JavaScript Promise APIは新しい API です。Promise の助けを借りて、setTimeout 関数を改善できます。以下は、setTimeout() を sleep() にカプセル化するものです。 Promiseを返す関数。

// https://zeit.co/blog/async-and-await
function sleep (time) {
  return new Promise((resolve) => setTimeout(resolve, time));
}

// 用法
sleep(500).then(() => {
    // 这里写sleep之后需要去做的事情
})

この書き方は、他のプログラミング言語の遅延関数や待機関数とよく似ていて、非常に洗練されていることがわかります。 Promise API を使用すると、コールバック関数の受け渡しを回避でき、実装では ES6 のアロー関数も使用します。

ここで言及する必要がある問題の 1 つは、この sleep() が実行中に「ブロック」プログラムを実行し続けることです。同期ではありません。後続のコードの実行に影響を与えずに同期的に実行したい場合は、 async/await キーワードを使用できます。

(async function() {
  console.log('Do some thing, ' + new Date());
  await sleep(3000);
  console.log('Do other things, ' + new Date());
})();

実行結果:

Do some thing, Mon Feb 23 2015 21:52:11 GMT+0800 (CST)  
Do other things, Mon Feb 23 2015 21:52:14 GMT+0800 (CST)

今回は、sleep() が 2 番目の console の実行を妨げないことがわかります。

ただし、 async/await は ES7 の構文であり、まだ実験段階にあります。この async/await 機能を今すぐ使用したい場合はどうすればよいですか? Google の JavaScript プリコンパイラーである Traceur を試してみると、JavaScript の上位バージョンを ES5 コードにコンパイルでき、async/await を実験的にサポートしています (これを指定するには、-experimental を使用する必要があります)。

推奨チュートリアル: 「JavaScript 基本チュートリアル」

以上がJavaScript の sleep() メソッドについて話しましょうの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。