1. ホーム
  2. アンギュラー

[解決済み】TypeScriptでsleep関数を実装するには?

2022-04-12 18:25:33

質問

Angular 2でTypeScriptを使ったWebサイトを開発しているのですが、その際に thread.sleep(ms) 機能を提供します。

私のユースケースは、フォームを送信した後、数秒後にユーザーをリダイレクトすることです。これはJavaScriptでは非常に簡単ですが、TypeScriptでそれを行う方法がよくわかりません。

どのように解決するのですか?

でTypeScript 2.0を待つ必要があります。 async / await ES5をサポートするために、TSからES6へのコンパイルにのみサポートされるようになりました。

で遅延関数を作成することができるようになります。 async :

function delay(ms: number) {
    return new Promise( resolve => setTimeout(resolve, ms) );
}

そして、それを呼び出す

await delay(1000);

ちなみに Promise を直接指定します。

await new Promise(f => setTimeout(f, 1000));

を使用することができることに注意してください。 await の中だけです。 async 関数を使用します。

できない場合( 例えば、nodejsアプリケーションを構築しているとします。 を使用する場合は、コードを匿名の async 関数を使用します。以下はその例です。

    (async () => { 
        // Do something before delay
        console.log('before delay')

        await delay(1000);

        // Do something after
        console.log('after delay')
    })();

TSアプリケーションの例。 https://github.com/v-andrew/ts-template

OLD JSでは

setTimeout(YourFunctionName, Milliseconds);

または

setTimeout( () => { /*Your Code*/ }, Milliseconds );

しかし、すべての主要なブラウザが async / await というのは、あまり意味がありません。

更新しました。 TypeScript 2.1が登場し async/await .

ただ、忘れてはいけないのは、必要なのは Promise の実装は、Promise がネイティブに利用できない ES5 にコンパイルする際に使用されます。

<ブロッククオート

PS

をしなければならない。 関数をエクスポートします。 を、元のファイルの外で使用したい場合。