# hw2：Event Loop + Scope

請說明以下程式碼會輸出什麼，以及盡可能詳細地解釋原因。

for(var i=0; i<5; i++) {
  console.log('i: ' + i)
  setTimeout(() => {
    console.log(i)
  }, i * 1000)
}

[](https://google.com)

1. main() 被放進去 call stack
2. for 迴圈被放進去 call stack
3. 執行 for 迴圈
4. 宣告 i 為全域變數
5. 把 i 賦值為 0
6. 由於 i < 5 () 為 true 進入 for 迴圈
7. console.log('i: ' + i) 被放進去 call stack
8. 執行 console.log('i: ' + i)
9. 印出 i: 0
10. 把 console.log('i: ' + i) 移出 call stack
11. 把 setTimeout(() => {console.log(i)}, i * 1000) 放進去 call stack
12. 把 setTimeout(() => {console.log(i)}, i * 1000) 設定定時器，會在 0 秒過後把這個函式 () => console.log(i) 放入 callback queue
13. 再執行一次 for 迴圈
14. 此時 i = 0, i + 1 = 1，由於 i < 5 () 為 true 進入 for 迴圈
15. console.log('i: ' + i) 被放進去 call stack
16. 執行 console.log('i: ' + i)
17. 印出 i: 1
18. 把 console.log('i: ' + i) 移出 call stack
19. 把 setTimeout(() => {console.log(i)}, i * 1000) 放進去 call stack
20. 把 setTimeout(() => {console.log(i)}, i * 1000) 設定定時器，會在 1000 秒過後把這個函式 () => console.log(i) 放入 callback queue
21. 再執行一次 for 迴圈
22. 此時 i = 1, i + 1 = 2，由於 i < 5 () 為 true 進入 for 迴圈
23. console.log('i: ' + i) 被放進去 call stack
24. 執行 console.log('i: ' + i)
25. 印出 i: 2
26. 把 console.log('i: ' + i) 移出 call stack
27. 把 setTimeout(() => {console.log(i)}, i * 1000) 放進去 call stack
28. 把 setTimeout(() => {console.log(i)}, i * 1000) 設定定時器，會在 2000 秒過後把這個函式 () => console.log(i) 放入 callback queue
29. 再執行一次 for 迴圈
30. 此時 i = 2, i + 1 = 3，由於 i < 5 () 為 true 進入 for 迴圈
31. console.log('i: ' + i) 被放進去 call stack
32. 執行 console.log('i: ' + i)
33. 印出 i: 3
34. 把 console.log('i: ' + i) 移出 call stack
35. 把 setTimeout(() => {console.log(i)}, i * 1000) 放進去 call stack
36. 把 setTimeout(() => {console.log(i)}, i * 1000) 設定定時器，會在 3000 秒過後把這個函式 () => console.log(i) 放入 callback queue
37. 再執行一次 for 迴圈
38. 此時 i = 3, i + 1 = 3，由於 i < 5 () 為 true 進入 for 迴圈
39. console.log('i: ' + i) 被放進去 call stack
40. 執行 console.log('i: ' + i)
41. 印出 i: 4
42. 把 console.log('i: ' + i) 移出 call stack
43. 把 setTimeout(() => {console.log(i)}, i * 1000) 放進去 call stack
44. 把 setTimeout(() => {console.log(i)}, i * 1000) 設定定時器，會在 4000 秒過後把這個函式 () => console.log(i) 放入 callback queue
45. 再執行一次 for 迴圈
46. 此時 i = 4, i + 1 = 5，由於 i < 5 () 為 false 離開 for 迴圈
47. 把 for 迴圈 移出 call stack
48. 把 main() 移出 call stack
49. 目前 callback queue 有五個東西，依序是 () => console.log(i)  跟 () => console.log(i)  跟 () => console.log(i)   跟 () => console.log(i)   跟 () => console.log(i) 
50. call stack 是空的，把 callback queue 裡的 () => console.log(i) 放進去 call stack 
51. 執行 () => console.log('i')
52. 執行 console.log('i')
53. 印出 5
54. 把 console.log('i') 移出 call stack
49. 目前 callback queue 有四個東西，依序是 () => console.log(i)  跟 () => console.log(i)  跟 () => console.log(i)   跟 () => console.log(i)
55. call stack 是空的，把 callback queue 裡的 () => console.log(i) 放進去 call stack 
56. 執行 () => console.log('i')
57. 執行 console.log('i')
58. 印出 5
59. 把 console.log('i') 移出 call stack
49. 目前 callback queue 有三個東西，依序是 () => console.log(i)  跟 () => console.log(i)  跟 () => console.log(i) 
60. call stack 是空的，把 callback queue 裡的 () => console.log(i) 放進去 call stack 
61. 執行 () => console.log('i')
62. 執行 console.log('i')
63. 印出 5
64. 把 console.log('i') 移出 call stack
49. 目前 callback queue 有兩個東西，依序是 () => console.log(i)  跟 () => console.log(i)  
65. call stack 是空的，把 callback queue 裡的 () => console.log(i) 放進去 call stack 
66. 執行 () => console.log('i')
67. 執行 console.log('i')
68. 印出 5
69. 把 console.log('4') 移出 call stack
49. 目前 callback queue 有一個東西，依序是 () => console.log(i)  
70. call stack 是空的，把 callback queue 裡的 () => console.log(i) 放進去 call stack 
71. 執行 () => console.log('i')
72. 執行 console.log('i')
73. 印出 5
74. 把 console.log('i') 移出 call stack