【JavaScript】Asyncとawaitを試す【殴り書き】
Async
関数の前にasyncを付けることによってpromiseを返すようになる。例えばreturn 'hello'とすると
async function hello() { return 1; } console.log(hello());
実行結果
return <非 promise> がある場合、JavaScript は自動的にその値を持つ 解決された promise にラップします。
Async/await より引用
Await
Promiseの結果(fulfilled rejected)が確定するまで、待機する。
awaitはasyncが付いている関数の中で使うことができる。
async function hello() { let x = await new Promise((resolve)=>{ setTimeout(() => { resolve('hello'); }, 10000); }); console.log(x); } hello();
実行結果にhelloと表示される。resolveでfulfilledの状態になったPromiseのPromiseResultの値が変数xに代入される。
awaitでresolveになるまで処理を止めた訳ですが、awaitを無くしたらどうなるのか。
結論は解決(resolve)するのを待たずに、promiseインスタンスが代入される。
10秒待たずにconsole.logが実行される。
async function hello() { let x = new Promise((resolve)=>{ setTimeout(() => { resolve('hello'); }, 10000); }); console.log(x); } hello();
実行結果
※10秒経つとresolveされるので、開発者ツールで上記に出力したインスタンスのPromiseStateを見るとfulfilledの状態になっています。