Edited at

TypeScript 2.1でES3/ES5コードにasync/awaitを使う

More than 1 year has passed since last update.

TypeScript 2.1でターゲットがES3/ES5でも、async/awaitが使えるようになりました。

(※以前は、ES2015(ES6)ターゲットのときのみ利用可能でした。)

私は、非同期APIのテストで活用しています。

サンプルコードは以下のURLの「Downlevel Async Functions」で確認できます。

https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-1.html

tsconfig.jsonでlibを追加します。


  • "dom", "es2015"

  • もしくは "dom", "es2015.promise", "es5"


tsconfig.json

{

"compilerOptions": {
"lib": ["dom", "es2015.promise", "es5"]
}
}


  • 以下のサンプルの場合、Helloと出力後、500ミリ秒おきに "." が3回出力され、最後に "World!"と出力されます。


dramaticWelcome.ts

function delay(milliseconds: number) {

return new Promise<void>(resolve => {
setTimeout(resolve, milliseconds);
});
}

async function dramaticWelcome() {
console.log("Hello");

for (let i = 0; i < 3; i++) {
await delay(500);
console.log(".");
}

console.log("World!");
}

dramaticWelcome();