dojo/Deferred, dojo/when

簡介

dojo/Deferred 是 dojo 中實作 dojo/promise/Promise 的類別，也是使用 promise 的基礎元件。當一個作業要在非同步狀態下執行，而其它作業有可能必須在此作業完成後方能執行時；該作業在實作時便應宣告且產生一個 Deferred 類別的實體 (instance)，並傳回一個 promise。後繼要執行的作業則作為 promise.then() 的參數，在 promise 被「滿足」(fulfilled) 時執行。因為 promise.then() 也會傳回一個 promise；所以，整個程序可以一直串接下去，形成一個執行鏈。
dojo/when 只是 promise.then() 的一個簡單寫法。

範例

範例中建立了兩個圓形，點按左邊的圓形以模擬非同步的作業，右邊的圓形則顯示作業的進度，及顯示最終的結果。設定為點按三次左邊圓形便完成作業。修改一下程式碼可以產生「拒絕」(reject) 的結果。

CSS

<style>
html {
    width:100%;
    height:100%;
}
body {
    margin: 0 auto;
    width:1000px;
    height:100%;
    padding-top:20px;
}
#counter {
    margin:20px;
    height:100px;
    width:100px;
    border:10px solid black;
    border-radius: 50%;
    font-size: 48px;
    text-align: center;
    line-height: 100px;
    float:left;
}
#response {
    margin:20px;
    height:100px;
    width:100px;
    border:10px solid black;
    border-radius: 50%;
    font-size: 48px;
    text-align: center;
    line-height: 100px;
    background-color: white;
    float:left;
}
</style>

#counter 設定左邊圓形的屬性。
#response 設定右邊圓形的屬性。

HTML

<body class="claro">
  0
  0
</body>

HTML 則建立兩個 <div>，用來顯示左、右兩個圓形。

Script

取消第 36 ~ 40 行的註解並註解第 43 ~ 47 行；在點按左邊圓形三次後，會產生「拒絕」的結果，此時會執行第 62 ~ 70 行的程式。

第 54 ~ 80 用 when 的語法寫，則如下所示：

熊伯的外接硬碟

2016年3月4日星期五