如果有錯誤，歡迎留言指教~ Q_Q

callback，很重要！

外層的 component 一定拿不到內層的狀態，除非有 callback

props 也是一種 callback ，當 render 時，就會 call

如果這個 callback 被當作一個 prop 傳給下層的 component 的話，其他的 component 也許會做些多餘的 re-render

useEffect 會在 component 渲染完成後執行，類似 callback function

callback

Promise

then 的函數是選用的，以及 catch(failureCallback) 是 then(null, failureCallback) 的簡寫。

doSomething()
.then(result => doSomethingElse(result))
.then(newResult => doThirdThing(newResult))
.then(finalResult => {
  console.log(`Got the final result: ${finalResult}`);
})
.catch(failureCallback);

好處

1. 當次迴圈結束前，callback 不會被呼叫
2. 用 .then() 呼叫 callback，形成 async 非同步
3. 很多的 callback 就用很多個 .then() 串接起來
4. 最後可表示成功或是失敗的物件

async / await

// es6  async/await
async function foo() {
  try {
    let result = await doSomething();
    let newResult = await doSomethingElse(result);
    let finalResult = await doThirdThing(newResult);
    console.log(`Got the final result: ${finalResult}`);
  } catch(error) {
    failureCallback(error);
  }
}

ref

1. https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Guide/Using_promises

我其實沒寫完鴨 XDDD