淺淺淺談 Javascript - promise(一) : callback function
Appx 實習心得(一)
Promise感覺很難?await是base on Promise,那是不是更難使用?
在進公司前,對於promise的理解一直是一知半解的狀態,只知道如果結果跑不出來,或是不符合自己的期待,十之八九都是因為沒有加Promise的問題(前提是你寫的是對的,吧?)
網路上爬了許多教學,也在書局看過相關的文章,對Promise還是似懂非懂(當然,我現在懂了,不然不會在這邊分享自己的心得。)
最後還是腳踏實地的上戰場使用,才漸漸發現了承諾的美(?
要理解promise,需要循序漸進
- 理解同步與非同步函數
- 理解callback函數
- promise
- await
在想著要如何分享時看了一些網路上的文章,覺得這篇文章最適合想理解的初學者: https://scotch.io/tutorials/javascript-promises-for-dummies,所以我接下來的文章會大部分採納於此
為什麼要使用Promise?
回呼函數callback function
在進入promise前,必須先提到回呼函數callback function
(這邊會跳過同步非同步的部分,有興趣的朋友可以自己先去理解再回來)
回呼函式(callback function)是指能藉由參數(argument)通往另一個函式的函式。它會在外部函式內調用、以完成某些事情。
以下是簡單的例子:
const greeting = (name) => { //這是一個normal function
alert('Hello', name);
}const processUserInput = (callback) => { //這是一個callback function
let name = prompt('輸入你的名字:');
callback(name);
}processUserInput(greeting);
回呼函數通常是用在延續非同步行動完成後的程式執行,也稱作非同步回呼(asynchronous callbacks)。
舉例來說,我們可以在一個非同步函式中呼叫第三方的api,等到api回傳我們要的資料後,才繼續往下執行。
(至於為什麼要這樣寫程式才會等?這就不是這篇文章的範疇了><)
那為什麼不都用回呼函式就好了,要用Promise呢?
如果一隻函式中需要從許多api中撈值會長什麼樣子,這邊就有請我們著名的回呼地獄(callback hell)為您解說
看的很累嗎,這時候就是promise展露頭角的時候了!
未完待續...
referrence:
https://developer.mozilla.org/zh-TW/docs/Glossary/Callback_function
https://scotch.io/tutorials/javascript-promises-for-dummies
你懂JavaScript 嗎?#23 Callback | Summer。桑莫。夏天