關於jQuery的Promise的使用方法,大家了解多少?本文就主要和大家分享jQuery的Promise如何正確使用,希望能幫助大家。
先前了解了ES6的Promise對象,來看看jQuery中的Promise,也就是jQuery的Deferred對象。
先開啟瀏覽器的控制台。
運行結果:
和ES6的Promise物件長的有點像,jQuery的Deferred物件也有resolve 、reject、then方法,還有done、fail、always......方法。 jQuery就是用這個Deferred物件來註冊非同步操作的回呼函數,修改並傳遞非同步操作的狀態。
玩玩Deferred:
運行之後,Deferred物件的實例defer透過resolve方法把參數「非同步請求成功之後傳回的資料」傳回到then方法中進行接收,,列印。
和ES6的Promise相似,但是有一點點區別,再看下Promise:
我們發現:
##1、創建Deferred物件的時候沒有傳參;而創建Promise物件的時候,傳了參數(傳了一個匿名函數,函數也有兩個參數:resolve、reject);2、Deferred物件直接呼叫了resolve方法;而Promise物件則是在內部呼叫的resolve方法;說明:Deferred物件本身就有resolve方法,而Promise物件是在構造器中透過執行resolve方法,給Promise物件賦上了執行結果的狀態。 這樣就有一個弊端:因為Deferred物件自帶resolve方法,拿到Deferred物件之後,就可以隨時呼叫resolve方法,其狀態可以進行手動幹預了Deferred物件的then方法和done、fail語法糖
我們知道,在ES6的Promise規範中,then方法接受兩個參數,分別是執行完成和執行失敗的回調,而jquery中進行了增強,還可以接受第三個參數,就是在pending狀態時的回調,如下:deferred.then( doneFilter [, failFilter ] [ , progressFilter ] )
#
always的用法
jquery的Deferred物件上還有一個always方法,不論執行完成還是執行失敗,always都會執行,有點類似ajax中的complete。$.when的用法
jquery中,還有一個$.when方法來實作Promise,與ES6中的all方法功能一樣,並行執行非同步操作,在所有的非同步操作執行完後才執行回呼函數。不過$.when並沒有定義在$.Deferred中,看名字就知道,$.when,它是一個單獨的方法。與ES6的all的參數稍有區別,它接受的並不是數組,而是多個Deferred對象,如下:#success、error與complete
這三個方法是我們常用的ajax語法糖。$.ajax(/*...*/) .success(function(){/*...*/}) .error(function(){/*...*/}) .complete(function(){/*...*/})
總結:
$.Deferred實作了Promise規範,then、done、fail、always是Deferred物件的方法。 $.when是一個全域的方法,用來並行執行多個非同步任務,與ES6的all是一個功能。 ajax回傳一個受限的Deferred對象,success、error、complete是ajax提供的語法糖,功能與Deferred對象的done、fail、always一致。
相關建議:
以上是jQuery的Promise如何正確使用的詳細內容。更多資訊請關注PHP中文網其他相關文章!