javascriptはsleep関数を使うよくある方法を詳しく説明します。

本論文の実例は、javascriptがsleep関数を使用する一般的な方法を述べている。皆さんに参考にしてあげます。具体的には以下の通りです。
一.sleep関数は何ですか？
sleep関数について時間をかけて話します。まず何がsleep関数ですか？
sleepは指定された時間をプログラムを一時停止させる機能で、遅延効果があります。
たとえば:

console.log('1');
sleep(5000);
console.log('2');

コンソールからデジタル1を出力すると5秒間隔で数字2を出力します。
もちろん上のコードは実行できません。jsにsleepメソッドがないからです。
この文章は主にjsでsleepを実現する方法をいくつか紹介しています。
二.なぜsleepを使うのですか？
ここを見ていると、なぜsleepを使うのですか？上記の例はset Timeoutを使って実現できますか？
セットTimeoutはコールバック関数によってタイミングタスクを実現するので、マルチタスクのシーンではコールバックがネストされます。

console.time('runTime:');
setTimeout(function(){
 console.log('1')
 setTimeout(function(){
 console.log('2');
 setTimeout(function(){
  console.log('3');
  console.timeEnd('runTime:');
 }, 2000);
 }, 3000);
}, 2000);
// 1
// 2
// 3
// runTime:: 7013.104ms

上記の方法にはエコーネストの問題があります。優雅な方法で上記の例を実現したいです。

sleep(2000);
console.log('1');
sleep(3000);
console.log('2');
sleep(2000);
console.log('3');
...

三.sleepを実現する
次に、それぞれいくつかの異なる方法でsleep方法を実現します。
1.Dateによる実現
デッドサイクルによってコードの実行を停止し、タイムアウトを停止します。

function sleep(time){
 var timeStamp = new Date().getTime();
 var endTime = timeStamp + time;
 while(true){
 if (new Date().getTime() > endTime){
  return;
 } 
 }
}
console.time('runTime:');
sleep(2000);
console.log('1');
sleep(3000);
console.log('2');
sleep(2000);
console.log('3');
console.timeEnd('runTime:');
// 1
// 2
// 3
// runTime:: 7004.301ms

短所:
以上のコードはスレッドをスリープさせるのではなく、高負荷計算によりcpuを他のタスクに対して処理する余裕がないようにします。
このようにする欠点は、sleepの過程で他のすべてのタスクが一時停止され、domのレンダリングを含む。
sleepの過程でプログラムは仮死状態になり、他のタスクを実行しません。
2.Promiseベースのsleep
ajaxのエコーネスト問題を解決するために、jQuery 1.8の後にPromiseをサポートしました。ただ単純なPromiseは、前の縦入れ子を横入れ子に変更しただけで、
最終結果は以下のコードです。

function sleep(time){
 return new Promise(function(resolve){
 setTimeout(resolve, time);
 });
}
console.time('runTime:');
console.log('1');
sleep(1000).then(function(){
 console.log('2');
 sleep(2000).then(function(){
 console.log('3');
 console.timeEnd('runTime:');
 });
});
console.log('a');
// 1
// a
// 2
// 3
// runTime:: 3013.476ms

これは以前のsetTimeoutと入れ子の違いがなく、見苦しいです。
ES 6のGenerator関数を使って上記の例を書き換えます。
3.Generator関数に基づくsleep
sleepの実行はGenerator関数を用いて実行し，coを組み合わせて自己実行した。
コードを見る:

var co = require('co');
 
function sleep(time){
 return new Promise(function(resolve){
 setTimeout(resolve, time);
 });
}
 
var run = function* (){
 console.time('runTime:');
 console.log('1');
 yield sleep(2000);
 console.log('2');
 yield sleep(1000);
 console.log('3'); 
 console.timeEnd('runTime:');
}
 
co(run);
console.log('a');
// 1
// a
// 2
// 3
// runTime:: 3004.935ms

全体のコードは入れ子の関係がないように見えますか？それとも楽ですか？
また、実行中に仮死が発生しないため、他のタスクの実行をブロックしません。
しかし、一つのcoアクチュエータの引用が多くなりましたので、まだ瑕疵があります。
もちろんこれは最終版ではありません。ES 7は私たちに新しい解決策をもたらしてくれました。
4.async関数に基づくsleep
ES 7にasync関数が追加されました。async関数の最大の特徴はアクチュエータを持参することです。だから、私達はcoを通してsleepを実現できます。
コードを見る:

function sleep(time){
 return new Promise((resolve) => setTimeout(resolve, time));
}
 
async function run(){
 console.time('runTime:');
 console.log('1');
 await sleep(2000);
 console.log('2');
 await sleep(1000);
 console.log('3'); 
 console.timeEnd('runTime:');
}
 
run();
console.log('a');
 
// 1
// a
// 2
// 3
// runTime:: 3009.984ms

効果は前と同じです。
5.child_を使うprocess（子プロセス）がsleep関数を実現する。
いくつかの比較的簡単なsleep実現を紹介しましたが、これからは難しい実現を見ます。
原理は、sleepをサブプロセスにおいて実行することであり、他のプロセスに影響を与えず、コードを見ることである。

var childProcess = require('child_process');
var nodeBin = process.argv[0];
 
function sleep(time) {
 childProcess.execFileSync(nodeBin, ['-e', 'setTimeout(function() {}, ' + time + ');']);
 // childProcess.spawnSync(nodeBin, ['-e', 'setTimeout(function() {}, ' + time + ');']);
}
 
console.time('runTime:');
console.log('1');
sleep(1000);
console.log('2');
sleep(2000);
console.log('3');
console.timeEnd('runTime:');
 
// 1
// 2
// 3
// runTime:: 3579.093ms

以上のコードは、childProcessオブジェクトのexecFileSyncまたはspawnSyncを通じて同期プロセスを作成し、
同期中にタイマーを実行し、タイマーが実行したら回収プロセスを実行します。
6.npm sleepパッケージを使用する
前の内容は全部私達が自分で実現したものです。実はnpmにはすでに関連のjsカバンがたくさんあります。
彼らがどうやって実現したかを見に来ました。sleep。

var sleep = require('sleep');
 
console.log('1');
console.time('runTime:');
sleep.sleep(2); //  2  
console.log('2');
sleep.msleep(1000); //  1000  
console.log('3');
sleep.usleep(1000000) //  1000000   = 1 
console.log('4');
console.timeEnd('runTime:');
 
// 1
// 2
// 3
// 4
// runTime:: 4014.455ms

強いのかどうか、sleepパッケージはC++で作成し、Nodeに拡張してsleep関数を実現します。
いい選択です。
以上がsleepの6つの簡単な実現です。皆さん、問題を指摘してください。一緒に進歩します。
興味のある友達はオンラインHTML/CSS/JavaScriptコードを使ってツールを実行できます。http://tools.jb51.net/code/HtmlJsRun上記コードの運行効果をテストします。
もっと多くのJavaScriptに関する内容は当駅のテーマを調べられます。「JavaScript常用関数技術のまとめ」、「javascript対象向け入門教程」、「JavaScriptエラーとデバッグテクニックのまとめ」、「JavaScriptデータ構造とアルゴリズム技術のまとめ」及び「JavaScript数学演算の使い方のまとめ」
本論文で述べたように、JavaScriptプログラムの設計に役に立ちます。