何が出力されるでしょうか？

Question

```javascript
const foo = () => console.log("First");
const bar = () => setTimeout(() => console.log("Second"));
const baz = () => console.log("Third");

bar();
foo();
baz();
```

Accepted Answer

`setTimeout`関数があり、それを最初に呼び出したのですが、それは最後にログ出力されました。これは、ブラウザにはランタイムエンジンがあるだけでなく、`WebAPI`と呼ばれるものもあるからです。`WebAPI`は最初に`setTimeout`関数を与えてくれます。例えばDOMです。 callbackがWebAPIにプッシュされた後、`setTimeout`関数自体（コールバックではありません!）がスタックからポップされます。

今、`foo`が呼び出され、`"First"`が、ログ出力されています。

`foo`がスタックからポップされ、`baz`が呼び出されます。`"Third"`が、ログ出力されます。

WebAPIは、準備が整ったときにスタックに、なにかを追加することはできません。代わりに、コールバック関数を`queue`と呼ばれるものにプッシュします。

event loopが機能し始めるところです。 **event loop**はスタックとタスクキューを調べます。スタックが空の場合は、キューの最初のものを取り出し、それをスタックにプッシュします。

`bar`が呼び出され、`"Second"`がログ出力され、スタックからポップされます。

関連概念