課程目標
- 認識 async/await 語法與收尾處理
課程內容
接著來學 async/await 的收尾處理吧！
說起來也神奇，只要加上 finally 區塊就可以了！
try {
const data1 = await $.get(url, params);
// do something with data to get params2
const data2 = await $.get(url2, params2);
// do something with data to get params3
const data3 = await $.get(url3, params3);
// do the final task with data
} catch (err) {
alert('Something went wrong.');
} finally {
// hide the loading icon
}
因為 try/catch/finally 本來就是一般同步程式設計語言會用到的錯誤處理語法
所以這整段程式碼，看起來跟一般的同步程式設計，幾乎一模一樣！
就是這麼奇妙！應該不用我多解釋什麼了！
多補充一句，我個人開發比較複雜的前端應用時，最常用的語法就是這種！
我認為 async/await 加上 try/catch/finally 是最簡潔有力的！
錯誤訊息提示、忙碌狀態提示，通通都有了，很輕易就做出 UX 很棒的應用程式！
課後作業
請拿出第三課的作業，我們來改善這個頁面的 UX（使用者體驗），明確提示「忙碌中」這個狀態
- 請用 html 元素，在頁面中加入一段
讀取中，請稍等...的訊息，這個元素預設不顯示 - 在開始呼叫 API 的地方，用 js 操作來讓那個 html 元素顯示
- 在結束呼叫 API 的地方，使用
finally語法，用 js 操作來讓那個 html 元素隱藏
做出以上功能，你就完成這次的課程目標了！
歡迎將作業成果，在下方留言，跟大家分享，讓大家給你一些回饋！
可以將每課學到的觀念、關鍵字，丟到網路上去搜尋、研究一下！
發問請在「討論專區」為主，或者分享學習筆記、寫學習心得！
貼文都會出現在個人檔案頁面，成為學習歷程、部落格紀錄！
未來面試時，分享給面試官看，會讓人知道你的積極程度！
課程內容
作業繳交 https://jsfiddle.net/a48fwbup/4/