※ 認識非同步概念(一)

※ 同步概念：

單純地「由上而下」執行程式碼，而且一次只執行一件事，也就是「按順序執行，一個動作結束才能切換到下一個」。缺點是你需要「等待」事情執行完畢，才能繼續往下走。

※ 非同步概念：

盡可能讓主要的執行程序不需要停下來等待，若遇到要等待的事情，就發起一個「非同步處理」，讓主程序繼續執行，等到該操作執行完畢時，再回頭通知主程序，並交付處理結果。

為了讓管理非同步的程式碼變得更簡單，語法上主要使用Promise 和 async/await ，來寫出非同步式的程式碼。

※ 非同步注意事項：

• JavaScript 只是擅長用非同步的方式在不同事情間「切換」，它的本質仍然是一次執行一件事 (single thread)。
• 由於迴圈是同步執行的機制，因此不要設計一個需要跑很久的迴圈，讓程式卡住 (blocking)，讓使用者陷入空等。

※ Callback function概念：

CallBack的定義：一個程式執行完再去執行另一個程式。

Callback 的必要條件：

1. 讓函式成為另一個函式的參數：允許函數接收另一個函數作為參數，意思是允許我們將特定的行為（透過回調函數Callback）傳入到另一個函數中，並在適當的時候執行這些行為。

function A(Fn) {
  console.log('Hello')
  Fn()
}

function B() {
  console.log('Good')
}

A(B);  // 直接將 B 函數作為參數傳遞給 A

說明：

• 當 A(B) 被調用時，B 函數當成參數被傳遞給了 A。在 A 函數內部，參數 Fn 接收到了 B 的引用。因此，當 A 內部執行 Fn() 時，它實際上是在調用 B。

2. 讓函式控制參數函式的執行時機：意思是回調函數的執行並不是立即進行的，而是由接收回調的函數根據某些條件（如事件發生、異步操作完成等）來決定何時執行。這對於非同步來說尤其重要，例如在 JavaScript 中處理 HTTP 請求、讀取文件操作等。

function A () {
 setTimeout(function() {
   console.log('Hello')
 }, 5)
}

function B () {
  console.log('Good')
}
function C () {
  console.log('Good Morining')
}
A()
B()
C()

說明：

• 函數 A: 因為 setTimeout 本身是非同步的函式。在設定這 5 毫秒的延時內，JavaScript 不會等待，它會繼續執行後面的代碼，等到 5 毫秒到了，再切回來執行 setTimeout 裡的 console.log('hello')。
• 函數 B和函數 C立即印出"Good"和"Good Morning"，都是一個同步操作在呼叫 B()和(C)時就立即執行。
• 因此，即使 setTimeout 在 A() 中設定了非常短的延遲，B() 和 C() 的輸出還是會在 setTimeout 的回調函數之前執行。

輸出的順序會是：

1. "Good"
2. "Good Morining"
3. "Hello"