`await`はいつ同時に解決されますか？

Question

async functionのMDNドキュメントは、現在、awaitを使用する2つの方法の以下の結合された例を示しています。私は強調のためにちょうど少し並べ替えました：

function resolveAfter2Seconds(x) { 
    return new Promise(resolve => { 
    setTimeout(() => { 
     resolve(x); 
    }, 2000); 
    }); 
} 


async function add1(x) { 
    const a = await resolveAfter2Seconds(20); 
    const b = await resolveAfter2Seconds(30); 
    return x + a + b; 
} 

async function add2(x) { 
    const p_a = resolveAfter2Seconds(20); 
    const p_b = resolveAfter2Seconds(30); 
    return x + await p_a + await p_b; 
} 


add1(10).then(v => { 
    console.log(v); // prints 60 after 4 seconds. 
}); 

add2(10).then(v => { 
    console.log(v); // prints 60 after 2 seconds. 
}); 

これは私に少し驚きでした。

return x + await p_a + await p_b; 

は一見、同時に2つの約束を解決しながら、なぜ

const a = await resolveAfter2Seconds(20); 
const b = await resolveAfter2Seconds(30); 
return x + a + b; 

は、順次2つの約束を解決するのでしょうか？この動作は、具体的にはawaitに指定されていますか、それとも他の何かの自然な結果ですか？あなたはP_AおよびP_Bを待っていたときに、このステートメントP_AおよびP_Bで

Answer 1

async function add2(x) { 
    const p_a = resolveAfter2Seconds(20); 
    const p_b = resolveAfter2Seconds(30); 
    return x + await p_a + await p_b; 
} 

は（すなわち、できるだけ早くあなたが約束を生成するよう）並行して開始されているので、彼らは、平行ではなく、シーケンシャル表示されます。

あなたがする必要があります（直列に待っています）他の機能を取得するには：

return x + await resolveAfter2Seconds(20) + await resolveAfter2Seconds(30);