|
| 您的位置: 首頁 > 網(wǎng)站資訊 > 使用Promise模式來簡化javascript的異步回調(diào) |
使用Promise模式來簡化javascript的異步回調(diào)發(fā)布日期:2017/6/19
百度權(quán)重查詢 站長交易 友情鏈接交換 網(wǎng)站監(jiān)控 服務器監(jiān)控 seo監(jiān)控 網(wǎng)頁的交互越來越復雜,javascript 的異步操作也隨之越來越多。如常見的 ajax 請求,需要在請求完成時響應操作,請求通常是異步的,請求的過程中用戶還能進行其他的操作,不會對頁面進行壅塞,這種異步的交互效果對用戶來說是挺有友愛的。但是對于開發(fā)者來說,要大量處理這種操作,就很不友愛了。異步請求完成的操作必須預先定義在回調(diào)函數(shù)中,等到請求完成就必須調(diào)用這個函數(shù)。這種非線性的異步編程體例會讓開發(fā)者很不適應,同時也帶來了諸多的未便,增添了代碼的耦合度和復雜性,代碼的組織上也會很不優(yōu)雅,大大降低了代碼的可維護性。情況再復雜點,假如一個操作要等到多個異步 ajax 請求的完成才能進行,就會出現(xiàn)回調(diào)函數(shù)嵌套的情況,假如需要嵌套好幾層,那你就只能自求多福了。 先看看下面這個常見的異步函數(shù)。
假如要給該函數(shù)添加回調(diào),通常會這么干。
假如是使用 easy.js 的 Promise,添加回調(diào)的方法就會優(yōu)雅多了,前提是需要將原函數(shù)封裝成一個 promise 實例。
將一個通俗的函數(shù)封裝成一個 promise 實例,有3個關(guān)鍵步驟,步是在函數(shù)內(nèi)部構(gòu)造一個 promise 實例,第二步是部署函數(shù)執(zhí)行完去改變 promise 的狀況為已完成,第三步就是返回這個 promise 實例。每個 promise 實例都有3種狀況,分別為 pending(未完成)、resolved(已完成,成功)、rejected(已拒絕,失敗)。下面再來看看如何添加回調(diào)。
這樣就將回調(diào)函數(shù)和原來的異步函數(shù)徹底的星散了,從代碼組織上看,優(yōu)雅了許多。resolve 接受一個參數(shù),該參數(shù)就可以輕松實現(xiàn)將數(shù)據(jù)傳送給使用 then 方法添加的回調(diào)中。 對于 ajax 請求,easy.js 直接將 ajax 方法封裝成了 promise 對象,可以直接添加 then 方法往返調(diào)。
then 方法接受2個函數(shù)作為參數(shù),個函數(shù)是已完成的回調(diào),第二個就是已失敗的回調(diào)。 假如有上面提到的多個 ajax 請求的情況呢?那么就要用到 when 這個方法了。該方法可以接受多個 promise 實例作為參數(shù)。
when 方法是將多個 promise 實例存到一個數(shù)組中,等到該數(shù)組的所有 promise 實例都是已完成狀況才去執(zhí)行已完成的回調(diào),一旦有一個實例是已拒絕的狀況,則立即執(zhí)行已拒絕的回調(diào)。 Promise 模式是 CommonJS 的規(guī)范之一。許多主流的 javascript 庫都有響應的實現(xiàn),如 jQuery 和 Dojo 中,都有 Deferred 去實現(xiàn)這些功能。在這里照舊要吐槽下 jQuery 的 Deferred,撇開其內(nèi)部使用,這應該用戶使用率好低的一個模塊了,這和其較復雜的使用體例有一定的關(guān)系。 假如你想深入的研究 easy.js 的 promise 源碼,可以查看點擊這兒的鏈接。 文章來源:夜雨帶刀博客 |
| 其他相關(guān)文章 |
|
|
|
|
||||||||
| Copyright 2012-2026 上海蒙狼網(wǎng)絡科技有限公司 www.cimatek.net.cn All Rights Reserved |