回答編集履歴

+ ## 修正というか正しい非同期処理とその同期的処理

+

+ お二方から指摘がありますが、 pro() は呼び出した瞬間同期的に console.log(3) が実行されます。

+ というのも Promise を生成してますが引数に与えられたコールバック関数の中でいきなり `console.log(3)` としているからですね。

+ 例えば **３ 秒待った後に 3 と出力** するような非同期関をコールバック関数として引数に与えるのならば以下のようになります。

+

+ ```

+ const output3 = () => new Promise(resolve => {

+ setTimeout(() => {

+ console.log('3');

+ resolve();

+ }, 3000)

+ });

+ ```

+

+ そして以下のコードを試してみてください。

+

+ ```

+ output3();

+ console.log(2);

+ console.log(1);

+ ```

+

+ `3 2 1` と出力されそうですが、実際は `2 1 3` となります。

+

+ というのも `output3` が Promise を返す非同期処理だからですね。

+ output3 の Promise の処理が完了していることを期待して、 次の console.log() を実行するには `await` キーワードを使用して、 Promise の完了を待つ必要があります。

+ しかし、 await キーワードは `async function` の中でしか使えないという制約があるので以下のようにします。

+ （トップレベル await が可能な仕組みが現在作られています。ちなみに GoogleChrome の デベロッパーコンソールもトップレベル await が可能）

+

+ ```

+ async function() {

+ await output3();

+ console.log(2);

+ console.log(1);

+ }

+ ```

+

+ 関数宣言しただけでは動かないので即時呼び出しする（即時関数）

+

+ ```

+ (async function() {

+ await output3();

+ console.log(2);

+ console.log(1);

+ })();

+ ```

+

+ これを実行すると、めでたく 3秒待って 3が出力され、続いて 2, 1 となります。????

+

+ ---

+