JavaScript 程式札記 : async/await

閱讀時間約 2 分鐘

什麼是 async/await?

asyncawait是建立在Promise基礎上的語法糖,讓我們可以用更直觀、更像同步程式的方式來寫非同步程式。

async function fetchData() {
let response = await fetch("https://api.example.com/data");
let data = await response.json();
console.log(data);
}

fetchData();

在上面的範例中,fetchData是一個async函式。在這個函式中,我們使用await關鍵字來等待fetchresponse.json()這兩個Promise解決。這樣,我們就可以在非同步操作完成後,繼續執行後面的程式碼。

async/await 錯誤處理

當使用asyncawait時,我們也需要考慮到錯誤處理。最常見的方式是使用try/catch

async function fetchData() {
try {
let response = await fetch("https://api.example.com/data");
let data = await response.json();
console.log(data);
} catch (error) {
console.error("發生錯誤:", error);
}
}

fetchData();

在上面的範例中,如果fetchresponse.json()發生錯誤,我們會捕捉到這個錯誤,並在控制台輸出錯誤訊息。 

async/await 的優點

使用asyncawait的最大優點是它讓非同步程式碼看起來更像同步程式碼,更容易閱讀和理解。你不再需要使用大量的.then().catch(),也不需要處理複雜的回調函式。

此外,asyncawait也讓錯誤處理變得更簡單。你可以使用標準的try/catch結構,而不是在每個Promise後面都加上.catch()

總之,asyncawait提供了一個簡潔、直觀的方式來寫非同步程式碼,讓程式更容易維護和擴展。


😊 感謝你的耐心閱讀,若是你喜歡這篇內容,可以透過以下方式表達你的喜歡 😊

❤️按個愛心|💬留言互動|🔗分享此文|📌追蹤阿梧|☕請喝咖啡

60會員
91內容數
「梧笙」即「吾生」,意即我的生命,朋友都叫我「阿梧(Awu)」,高雄人。我喜歡學習新技能,從程式設計到網路工具,再到社群經營和影片剪輯。日常興趣是打遊戲、看動漫、讀小說和聽音樂。我會把這些興趣寫成文章,如果你有任何想法或問題,歡迎來信到我的郵箱 [email protected]
留言0
查看全部
發表第一個留言支持創作者!
梧笙の領域展開 的其他內容
Promise 是 JavaScript 中用於非同步操作的一個物件。當你需要執行一個可能需要一些時間的操作,例如從伺服器取得資料,而你不希望整個程式都停下來等待這個操作完成,這時候就可以使用 Promise。
SQL 是一種專門用來和資料庫進行溝通的程式語言,它讓我們能夠創建資料表、新增、查詢、修改和刪除資料庫中的資料,本文將介紹基本的創建、新增、查詢、修改和刪除的 SQL 語法。
當你在網路上購物或查詢資料時,有時候會發現網頁的某部分內容會自動更新,而不需要重新整理整個頁面,這背後的技術就叫做 AJAX。AJAX 是 "Asynchronous JavaScript and XML" ,意思是使用 JavaScript 以非同步的方式和伺服器交換資料。
Promise 是 JavaScript 中用於非同步操作的一個物件。當你需要執行一個可能需要一些時間的操作,例如從伺服器取得資料,而你不希望整個程式都停下來等待這個操作完成,這時候就可以使用 Promise。
SQL 是一種專門用來和資料庫進行溝通的程式語言,它讓我們能夠創建資料表、新增、查詢、修改和刪除資料庫中的資料,本文將介紹基本的創建、新增、查詢、修改和刪除的 SQL 語法。
當你在網路上購物或查詢資料時,有時候會發現網頁的某部分內容會自動更新,而不需要重新整理整個頁面,這背後的技術就叫做 AJAX。AJAX 是 "Asynchronous JavaScript and XML" ,意思是使用 JavaScript 以非同步的方式和伺服器交換資料。
你可能也想看
Google News 追蹤
Thumbnail
這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
Thumbnail
美國總統大選只剩下三天, 我們觀察一整週民調與金融市場的變化(包含賭局), 到本週五下午3:00前為止, 誰是美國總統幾乎大概可以猜到60-70%的機率, 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
Thumbnail
Faker昨天真的太扯了,中國主播王多多點評的話更是精妙,分享給各位 王多多的點評 「Faker是我們的處境,他是LPL永遠繞不開的一個人和話題,所以我們特別渴望在決賽跟他相遇,去直面我們的處境。 我們曾經稱他為最高的山,最長的河,以為山海就是盡頭,可是Faker用他28歲的年齡...
Thumbnail
工作上固定頻率會收到User提供的設定需求資訊,檔案大多為excel的格式.xlsx或.xls,需要擷取內容的參數資訊,轉換撰寫sql語法寫入資料庫進行操作。 既然格式都是固定的,何不動手寫個小工具,一鍵完成轉換呢?
Thumbnail
在網頁開發中,時間與日期的處理是重要且基礎的部分,本文將介紹 JavaScript 中的日期的處理方法,並提供範例程式來協助你理解。
Thumbnail
本文將介紹 JavaScript 中的字符串基本操作,包括連接、長度和切割,以及進階的搜索、替換和正則表達式操作,讓你瞭解如何有效地處理和操作字符串。
Thumbnail
閉包(Closure)簡單來說就是一個 Function,應該說是 Function 內的 Function,而內層的變數記憶體不會被釋放,所以即使外部函式已經執行完畢,仍然能記住並存取它自己所在的外部函式的變數。
Thumbnail
JSON 是一種數據交換格式,源於JavaScript,可讓程式設計師將拿到的資料結構從任何語言轉換成其他語言與平台可辨識的格式,由於其簡單、易讀和跨平台的兼容性,在Web開發中廣泛使用。
Thumbnail
這是 30 天寫作挑戰的第 16 天。今天要跟大家分享的主題是:3 個學習前端時,重要的程式框架
Thumbnail
這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
Thumbnail
美國總統大選只剩下三天, 我們觀察一整週民調與金融市場的變化(包含賭局), 到本週五下午3:00前為止, 誰是美國總統幾乎大概可以猜到60-70%的機率, 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
Thumbnail
Faker昨天真的太扯了,中國主播王多多點評的話更是精妙,分享給各位 王多多的點評 「Faker是我們的處境,他是LPL永遠繞不開的一個人和話題,所以我們特別渴望在決賽跟他相遇,去直面我們的處境。 我們曾經稱他為最高的山,最長的河,以為山海就是盡頭,可是Faker用他28歲的年齡...
Thumbnail
工作上固定頻率會收到User提供的設定需求資訊,檔案大多為excel的格式.xlsx或.xls,需要擷取內容的參數資訊,轉換撰寫sql語法寫入資料庫進行操作。 既然格式都是固定的,何不動手寫個小工具,一鍵完成轉換呢?
Thumbnail
在網頁開發中,時間與日期的處理是重要且基礎的部分,本文將介紹 JavaScript 中的日期的處理方法,並提供範例程式來協助你理解。
Thumbnail
本文將介紹 JavaScript 中的字符串基本操作,包括連接、長度和切割,以及進階的搜索、替換和正則表達式操作,讓你瞭解如何有效地處理和操作字符串。
Thumbnail
閉包(Closure)簡單來說就是一個 Function,應該說是 Function 內的 Function,而內層的變數記憶體不會被釋放,所以即使外部函式已經執行完畢,仍然能記住並存取它自己所在的外部函式的變數。
Thumbnail
JSON 是一種數據交換格式,源於JavaScript,可讓程式設計師將拿到的資料結構從任何語言轉換成其他語言與平台可辨識的格式,由於其簡單、易讀和跨平台的兼容性,在Web開發中廣泛使用。
Thumbnail
這是 30 天寫作挑戰的第 16 天。今天要跟大家分享的主題是:3 個學習前端時,重要的程式框架