在一年前初學js的時候,看過很多關於非同步編程的講解。但是由於實踐經驗少,沒有辦法理解的太多,太理論的東西也往往是看完就忘。 經過公司的三兩個項目的鍛煉,終於對js非同步編程有了比較具體的理解。但始終入門較淺,在這裡就當是給自己一個階段性的總結。 在非同步編程中,一條語句的執行不能依賴上一條語句執行完畢的... ...
在一年前初學js的時候,看過很多關於非同步編程的講解。但是由於實踐經驗少,沒有辦法理解的太多,太理論的東西也往往是看完就忘。
經過公司的三兩個項目的鍛煉,終於對js非同步編程有了比較具體的理解。但始終入門較淺,在這裡就當是給自己一個階段性的總結。
在非同步編程中,一條語句的執行不能依賴上一條語句執行完畢的結果,因為無法預測一條語句什麼時候執行完畢,它與代碼順序無關,語句是併發執行的。
例如以下代碼:
1 $.get($C.apiPath+'ucenter/padCharge/findMember',{id:memberId},function(data){ 2 if(data.error){ 3 layer.close(memberLayer); 4 padInOut(padId,memberId); 5 allPads(); 6 } 7 });
這三句在語境中的作用是,在完成某個ajax訪問併成功獲得數據之後,關閉某個彈層(1),執行padInOut函數(2),執行allPads函數(3);(1)的順序無所謂,但是我希望(3)在(2)之後執行,然而這幾句代碼無法達到我希望的結果,因為三個函數是同時執行的,allPads無法等待padInOut執行完畢之後再執行,所以結果當然會出錯。
我最後採取的解決方法是回調函數:在padInOut函數定義加入回調函數,如下:
1 function padInOut(padId,memberId,callback){ 2 $F.POSTLoading($C.apiPath + 'ucenter/padCharge/padInOut',{id:padId,memberId:memberId},function(data){ 3 if(callback)callback() 4 }); 5 };
當方法執行完畢並且回調函數存在時,執行回調函數。此時函數執行時通過傳參即可達到目的:padInOut(padId,memberId,allPads)
回調函數是js非同步編程經常會用到的方法。然而使用回調函數存在不好的地方,即會造成回調地獄。所以es新標準出來也不斷尋求解決回調的方案。這是後話,本篇寫到這裡。