Promiseのresolve後の挙動
初歩的な知識だと思うけど、割と詰まったのでログ。
function f1() { return new Promise(resolve => { for (let i = 0; i < 10; i++) { if (i > 3) resolve(i); console.log(i); } }); } async function f2() { const r = await f1(); console.log(r); } f2();
これを実行すると、console.log(i)
が全て出力されてから console.log(r)
が実行される。
これから、Promise の resolve 後の挙動は、
- resolve で Promise の状態は fulfilled に
- 処理は継続
- 処理が全て終わってから値がリターン
になってる。ってことかな。
これを解決するには、
function f1() { return new Promise(resolve => { for (let i = 0; i < 10; i++) { if (i > 3) resolve(i); else console.log(i); } }); } async function f2() { const r = await f1(); console.log(r); } f2();
でよい。
また、resolve() は一回しか呼べないので、
function f1() { return new Promise(resolve => { for (let i = 0; i < 10; i++) { resolve(i); } }); } async function f2() { const r = await f1(); console.log(r); } f2();
これは 0
が返ってくる。
ただし、どっちも resolve 読んだ後も処理が続いているはずなので、無駄な処理が入ってる。のか。
ふーーむ。
体系的に js の勉強しないとなーーー。
追記1: return 読んでもそこで executor の処理が終わる。