1. ホーム
  2. ジャバスクリプト

[解決済み】JavaScript版sleep()とは?)

2022-03-18 17:06:49

質問

を設計する良い方法はありますか? sleep をJavaScriptで書くと、以下のようになります。 pausecomp 関数 ( ここから引用 )?

function pausecomp(millis)
{
    var date = new Date();
    var curDate = null;
    do { curDate = new Date(); }
    while(curDate-date < millis);
}

と重複することはありません。 Sleep in JavaScript - アクション間の遅延 が欲しいのですが。 リアルスリープ を関数の途中で実行し、コードの一部が実行される前に遅延させることはありません。

解決方法は?

2017年~2021年アップデート

この質問がされた2009年以降、JavaScriptは大きく進化しました。他のすべての回答は、今では時代遅れか、過度に複雑になっています。以下は現在のベストプラクティスです。

function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}

あるいはワンライナーとして。

await new Promise(r => setTimeout(r, 2000));

または

const sleep = ms => new Promise(r => setTimeout(r, ms));

として使用します。

await sleep(<duration>);

デモの様子

function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}

async function demo() {
    for (let i = 0; i < 5; i++) {
        console.log(`Waiting ${i} seconds...`);
        await sleep(i * 1000);
    }
    console.log('Done');
}

demo();

注意してください。

  1. await が接頭辞としてつく関数の中でしか実行できません。 async キーワード、またはスクリプトのトップレベルの 増加する環境 .
  2. await を一時停止するだけで、現在の async 関数を使用します。つまり、スクリプトの残りの部分の実行をブロックすることはなく、ほとんどの場合に必要なものです。ブロックする構成が必要な場合は、以下を参照してください。 この答え を使って Atomics .wait しかし、ほとんどのブラウザは、ブラウザのメインスレッドでは許可しないことに注意してください。

この"sleep"関数の記述には、JavaScriptの2つの新機能(2017年現在)が役立っています。

互換性

何らかの理由で7より古いNodeを使用している場合(この時点で 2017年の終息 )、または古いブラウザを対象としています。 async / await を経由して使用することができます。 バベル (するツール)。 トランスパイル JavaScript + 新機能を普通のJavaScriptに変換する)、および transform-async-to-generator プラグインを使用します。