Open3
async/awaitを自分なりに理解する
fetch
fetchを利用する際にも、async/awaitは使用される。
async function getUserAccount() {}
の中で、
const response = await fetch('https://example.com/user');
など。
- fetchはサーバにリクエストを送信する非同期関数
- 普通はfetchを実行してもレスポンスが返ってくるのを待たずに次の行を実行
- fetchの前にawaitをつけることで、fetchの処理が最後まで完了してから次の行を実行させることができる
- awaitしたいときは今書いている関数にasyncをつけてあげる必要があるので、async/awaitはセットで使う
- 非同期関数が出てきたらawaitを使う、awaitを使いたいからasyncをつける
awaitにはasyncが必須。
asyncにはawaitは必須でないが、ただの関数となる。
通常通りsetTimeoutを行った場合
function test() {
console.log("before timeout"); // 1
setTimeout(function () {
console.log("timeout"); // 3
}, 2000);
console.log("after timeout"); // 2
}
test();
async awaitを使用した場合
function delay(ms) {
return new Promise((resolve) => setTimeout(resolve, ms));
}
async function asyncTest() {
console.log("before timeout"); // 1
await delay(2000);
console.log("timeout"); // 2
console.log("after timeout"); // 3
}
asyncTest();