when也是一個非常有用的方法,常用于合并多個異步操作:
$.when(d1,d2,d3,d4......).done(function(v1, v2,v3...) { //等待所有異步加載完畢后執(zhí)行 });
用法很簡單,把所有的異步丟到when中,when會處理所有的結(jié)果。當(dāng)然d1,d2,d3都是有規(guī)范的,都是通過Deferred產(chǎn)生的。
具體的用法見右側(cè)代碼編輯器中的代碼。
如果向 jQuery.when()
傳入延遲對象,那么會返回它的 Promise 對象(延遲方法的一個子集)??梢岳^續(xù)綁定 Promise 對象的其它方法,例如, defered.then
。當(dāng)延遲對象已經(jīng)被解決(resolved)或被拒絕(rejected)(通常是由創(chuàng)建延遲對象的最初代碼執(zhí)行的),那么就會調(diào)用適當(dāng)?shù)幕卣{(diào)函數(shù)。例如,由 jQuery.ajax()
返回的 jqXHR 對象是一個延遲對象,可以向下面這樣使用:
$.when($.ajax("test.aspx")).then(function(data, textStatus, jqXHR) { alert(jqXHR.status); // alerts 200 });
我們通過模擬的代碼,可以很簡單的分析整個流程:
1. 傳遞了多個異步對象,然后遍歷每個異步對象給每一個對象綁定done、fail、progess方法,無非就是監(jiān)聽每一個異步的狀態(tài)(成功,失?。绻峭瓿闪俗匀粫せ頳one方法。
2. updateFunc是監(jiān)聽方法,通過判斷異步對象執(zhí)行的次數(shù)來決定是不是已經(jīng)完成了所有的處理或者是失敗處理
3. 因為when也要形成異步操作,
比如when().done(),所以內(nèi)部必須新建一個
jQuery.Deferred()對象,用來給后面鏈?zhǔn)秸{(diào)用。
4. 此刻監(jiān)聽所有異步對象(d1,d2...)的updateFunc的處理都完畢了,會給一個正確的通知給when后面的done方法,因為done是通過第三步j(luò)Query.Deferred()創(chuàng)建的,所以此時就需要發(fā)送消息到這個上面,即:
deferred.resolveWith(contexts, values);
5. 內(nèi)部的jQuery.Deferred()因為外部綁定了when().done(),所以done自然就收到了updateFunc給的消息了,可以繼續(xù)之后的操作了。
所以整個執(zhí)行流程就是這樣簡單,我們通過右邊最簡單的模擬出這個效果。
整個when的設(shè)計其實最終還是依賴了jQuery.Deferred內(nèi)部處理的機(jī)制,一層套一層。當(dāng)然jQuery的異步設(shè)計邏輯也確實很復(fù)雜,需要思維跳轉(zhuǎn)很活躍,某一個時間在這里,下一個片段又要另一個地方去了,不是按照同步代碼這樣執(zhí)行的。需要大家有一定的空間跳躍力了。
請驗證,完成請求
由于請求次數(shù)過多,請先驗證,完成再次請求
打開微信掃碼自動綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書簽
舉報