※ 認識非同步概念(三)

更新於 發佈於 閱讀時間約 2 分鐘

什麼是 Promise.all?

在有多個 Promise 的時候,使用 Promise.all 可以確保「所有的 Promise 都執行完以後,才進入 then」。

Promise.all 語法結構

Promise.all 接受的參數是陣列形式。

raw-image

什麼時候要使用 Promise.all?

當程式需要處理多個 Promise 要執行時,而這些 Promise 之間沒有明確的先後順序,但一定需要「全都執行完」,才能進入後續流程,此時,你就可以考慮使用 Promise.all。

Promise.all範例:

const oneSecond = new Promise((resolve, reject) => {
setTimeout (() => {
//一秒後回傳資料
resolve('one second')
}, 1000)
})
const towSecond = new Promise ((resolve, reject) => {
//兩秒回傳資料
resolve('tow Second')
}, 2000)
const threeSecond = new Promise ((resolve, reject) => {
//三秒回傳資料
resolve('three Second')
}, 2000)
//等到三個Promise都成功回傳後,才執行接下去的流程
Promise.all([oneSecond, towSecond, threeSecond ])
.then(([oneSecond, towSecond, threeSecond ]) => {
console.log(oneSecond, towSecond, threeSecond)
})//輸出結果"one second","tow Second","three Second"
全端網頁開發專業知識分享
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
※ Promise基本介紹 什麼是 Promise? Promise 是 JavaScript 的一個構造函式,用於創建表示非同步操作的物件實例。使用 new Promise() 時,你會創建一個包含非同步操作的實例,這個實例可以透過其繼承的方法如 then(), catch(), 和 fina
※ 同步概念: 單純地「由上而下」執行程式碼,而且一次只執行一件事,也就是「按順序執行,一個動作結束才能切換到下一個」。缺點是你需要「等待」事情執行完畢,才能繼續往下走。 ※ 非同步概念: 盡可能讓主要的執行程序不需要停下來等待,若遇到要等待的事情,就發起一個「非同步處理」,讓主程序繼續執行,
※ 函式進階介紹: 箭頭函式: 箭頭函式相比於一般函式,語法相當簡潔。除了少去 function 關鍵字,如果只有一個參數,箭頭函式可以省略括號;只有一行程式碼,就是直接簡單返回一個變數或簡單的表達式,可以省略大括號和 return。例子如下: //一般函式計算平方用的寫法 const squ
※ 函式基礎介紹: ※ JavaScript 特殊的函式特性: 函式可以當成值來傳遞 (可以放進變數或放進物件) 函式可以當成函式的參數 callback - 在特定事件中觸發函式 (非同步特性) ※ 函式的基本寫法: ※ 調用 (invoke) 函式: "調用" 意指呼叫或執行
※ switch用法: ​switch是 JavaScript 中的一個控制結構,是一種更結構化的方法來替代多個 if...else 語句,特別是當需要根據同一變數的多個值進行不同操作時非常有用。 ※ switch語法: switch 語句首先評估括號內的表達式 (expression)。
※ 條件判斷語法 決策中需要處理分歧的狀況,就會用到「if」、「else if」、「else」。 ※ 語法結構: 條件式使用小括號(),裡面放判斷式。 要執行的程式碼放在大括號{}裡。 條件式只會有 true 或 false 兩種結果。 ※ 常用的比較運算子: > 大於 < 小於
※ Promise基本介紹 什麼是 Promise? Promise 是 JavaScript 的一個構造函式,用於創建表示非同步操作的物件實例。使用 new Promise() 時,你會創建一個包含非同步操作的實例,這個實例可以透過其繼承的方法如 then(), catch(), 和 fina
※ 同步概念: 單純地「由上而下」執行程式碼,而且一次只執行一件事,也就是「按順序執行,一個動作結束才能切換到下一個」。缺點是你需要「等待」事情執行完畢,才能繼續往下走。 ※ 非同步概念: 盡可能讓主要的執行程序不需要停下來等待,若遇到要等待的事情,就發起一個「非同步處理」,讓主程序繼續執行,
※ 函式進階介紹: 箭頭函式: 箭頭函式相比於一般函式,語法相當簡潔。除了少去 function 關鍵字,如果只有一個參數,箭頭函式可以省略括號;只有一行程式碼,就是直接簡單返回一個變數或簡單的表達式,可以省略大括號和 return。例子如下: //一般函式計算平方用的寫法 const squ
※ 函式基礎介紹: ※ JavaScript 特殊的函式特性: 函式可以當成值來傳遞 (可以放進變數或放進物件) 函式可以當成函式的參數 callback - 在特定事件中觸發函式 (非同步特性) ※ 函式的基本寫法: ※ 調用 (invoke) 函式: "調用" 意指呼叫或執行
※ switch用法: ​switch是 JavaScript 中的一個控制結構,是一種更結構化的方法來替代多個 if...else 語句,特別是當需要根據同一變數的多個值進行不同操作時非常有用。 ※ switch語法: switch 語句首先評估括號內的表達式 (expression)。
※ 條件判斷語法 決策中需要處理分歧的狀況,就會用到「if」、「else if」、「else」。 ※ 語法結構: 條件式使用小括號(),裡面放判斷式。 要執行的程式碼放在大括號{}裡。 條件式只會有 true 或 false 兩種結果。 ※ 常用的比較運算子: > 大於 < 小於
你可能也想看
Google News 追蹤
Thumbnail
在創作的路上真的很多人問我說 到底要怎麼做出符合自己期待 但又可以表現得很有美感的作品?🥹 這個問題真的應該是每個創作者都一直在學習的課題吧!
提問的內容越是清晰,強者、聰明人越能在短時間內做判斷、給出精準的建議,他們會對你產生「好印象」,認定你是「積極」的人,有機會、好人脈會不自覺地想引薦給你
Thumbnail
人這輩子總是在等, 等將來 等不忙 等下次 等有時間 等有條件 等有錢了 可是後來 等沒了選擇 等來了遺憾 您,還等啥? 輕輕說聲 早安,別等了!
Thumbnail
在網路速度有限的情況下,依序記錄不斷產生的資訊,能統計使用者在頁面上操作了哪些功能。
Thumbnail
分享一個有趣的套件,名為 await-to-js。 可以讓 Promise 與 await 的寫法更簡潔。
Thumbnail
簡要說明 JavaScript 的 Event Loop JavaScript 是單執行緒 (single-threaded) 語言,這意味著它一次只能執行一件事,因此所有函式都需要排隊等待執行,這被稱為同步 (synchronous)。在同步操作中,若函式過多或過於複雜,會導致程式阻塞 (blo
Thumbnail
不必急著給出答案 時間可以證明一切
Thumbnail
人們在言行一致性方面的心理現象,以及這種一致性對行為的影響。強調了人們對於一致性的渴望,以及在面對承諾時,可能會因為想要保持一致而做出不理智的行為。引用研究和專家觀點,提出了策略來應對這種心理現象,例如利用承諾來促使行為一致。總的來說,提醒我們要意識到言行一致性的影響,並在做出承諾前仔細考慮。
Thumbnail
語言是一個偉大的存在 幫助我們學習認知和溝通 但這些都不是我們要談的重點 重點是~~ 有時候我們會遇到一種情況 我們在某些時候跟人約定 也許是承諾以後不會做怎樣的事 也許是承諾以後都會做某些事 承諾本質帶給人安心 說到做到給人踏實的感覺 這樣很棒!! 但如果以上做的這些
Thumbnail
非同步程式設計(Asynchronous programming) 或是簡單的稱之為 async,它是一種並發程式模型(concurrent programming model),其目的就是讓多個任務能同時在作業系統的執行緒上執行,並透過 async/.await 保留同步。
生活實驗 六二三 所謂上進, 就是多做一些為難自己的事。 所謂豁達, 就是別人見證的事就一起高興了。 所謂脾氣好, 就是這次就算了,下一次我一定要預約。
Thumbnail
在創作的路上真的很多人問我說 到底要怎麼做出符合自己期待 但又可以表現得很有美感的作品?🥹 這個問題真的應該是每個創作者都一直在學習的課題吧!
提問的內容越是清晰,強者、聰明人越能在短時間內做判斷、給出精準的建議,他們會對你產生「好印象」,認定你是「積極」的人,有機會、好人脈會不自覺地想引薦給你
Thumbnail
人這輩子總是在等, 等將來 等不忙 等下次 等有時間 等有條件 等有錢了 可是後來 等沒了選擇 等來了遺憾 您,還等啥? 輕輕說聲 早安,別等了!
Thumbnail
在網路速度有限的情況下,依序記錄不斷產生的資訊,能統計使用者在頁面上操作了哪些功能。
Thumbnail
分享一個有趣的套件,名為 await-to-js。 可以讓 Promise 與 await 的寫法更簡潔。
Thumbnail
簡要說明 JavaScript 的 Event Loop JavaScript 是單執行緒 (single-threaded) 語言,這意味著它一次只能執行一件事,因此所有函式都需要排隊等待執行,這被稱為同步 (synchronous)。在同步操作中,若函式過多或過於複雜,會導致程式阻塞 (blo
Thumbnail
不必急著給出答案 時間可以證明一切
Thumbnail
人們在言行一致性方面的心理現象,以及這種一致性對行為的影響。強調了人們對於一致性的渴望,以及在面對承諾時,可能會因為想要保持一致而做出不理智的行為。引用研究和專家觀點,提出了策略來應對這種心理現象,例如利用承諾來促使行為一致。總的來說,提醒我們要意識到言行一致性的影響,並在做出承諾前仔細考慮。
Thumbnail
語言是一個偉大的存在 幫助我們學習認知和溝通 但這些都不是我們要談的重點 重點是~~ 有時候我們會遇到一種情況 我們在某些時候跟人約定 也許是承諾以後不會做怎樣的事 也許是承諾以後都會做某些事 承諾本質帶給人安心 說到做到給人踏實的感覺 這樣很棒!! 但如果以上做的這些
Thumbnail
非同步程式設計(Asynchronous programming) 或是簡單的稱之為 async,它是一種並發程式模型(concurrent programming model),其目的就是讓多個任務能同時在作業系統的執行緒上執行,並透過 async/.await 保留同步。
生活實驗 六二三 所謂上進, 就是多做一些為難自己的事。 所謂豁達, 就是別人見證的事就一起高興了。 所謂脾氣好, 就是這次就算了,下一次我一定要預約。