在這種情況下應用PromiseJS

Question

我剛剛開始使用帶有節點，require和browserify的js模塊並嘗試獲取代碼來工作，最初是在單個腳本中。

我也想開始使用promise，但我不確定如何在這種情況下應用它。

所有需要browserify部分似乎工作，所以我會把所有沒有相關位爲簡單起見。

在一個模塊中我有這樣的事情

module.exports.api = function(){ 

var getCurrentProcessInstanceTask = function getCurrentProcessInstanceTask(options) { 
     if (!currentProcess || !currentProcess.id) { 
     throw new Error("no currentProcess is set, cannot get active task"); 
     return; 
     } 
     var processInstanceId = currentProcess.id; 

     jQuery.get(hostUrl + "service/runtime/tasks", { 
      processInstanceId: processInstanceId 
     }) 
     .done(function(data) { 
      console.log("response: " + JSON.stringify(data, null, 2)); 
      currentProcess.tasks = data.data; 

      if (options && options.callback) { 
       options.callback(data.data); 
      } 
     }); 
    } 

return { 
getCurrentProcessInstanceTask: getCurrentProcessInstanceTask 
} 

} 

那麼其他模塊中我有這樣的事情

var Api = require('./api'); 

    module.exports.view = function(){ 

    var api = Api(); 

    var setupEmbeddedView = function setupEmbeddedView(url, tmpl) { 
      tmpls.renderExtTemplate({ 
      name: tmpl, 
      selector: targetDiv, 
      data: { 
      url: url, 
      width: iframeTargetDiv.width(), 
      height: iframeTargetDiv.height() 
      }, 
      callback: function() { 
       jQuery('#taskFormFrame').load(function(e) { 
       console.log("taskFormFrame load fired!"); 

       }); 

      } 
      }); 
     }, 
    showCurrentTaskForm = function showCurrentTaskForm() { 
      console.log("mark"); 
      api.getCurrentProcessInstanceTask({ 
      callback: function(tasks) { 
       setupEmbeddedView(getTaskFormUrl(tasks), 'showTaskForm'); 
      } 
      }); 
     } 

    return { 
    showCurrentTaskForm: showCurrentTaskForm 

    } 

    } 

調用showCurrentTaskForm在另一個模塊中，其中視圖需要的結果的API .getCurrentProcessInstanceTask正在執行的部分，但setupEmbeddedView永遠不會被調用。

我很困惑爲什麼也許有人可以解釋。

另外，我想我會如何應用promisejs在這種特殊情況下，而不是使用回調鏈職能

Answer 1

當前的jQuery的版本不履行承諾/ A +規格的例子。我會推薦使用單獨的承諾庫，例如bluebird。

運行異步代碼塊的每個函數都應該返回一個promise。

看着你的代碼，getCurrentProcessInstanceTask，因此它應該返回一個承諾。

由於您使用的是返回jQuery承諾的jQuery.get()，因此您必須讓藍鳥同化該承諾來創建合適的承諾鏈。

var getCurrentProcessInstanceTask = function getCurrentProcessInstanceTask() { 

    if (!currentProcess || !currentProcess.id) { 
     return Promise.reject(new Error("no currentProcess is set, cannot get active task")) 
    } 

    var processInstanceId = currentProcess.id; 

    return Promise.resolve(jQuery.get(hostUrl + "service/runtime/tasks", {processInstanceId: processInstanceId}) 
     .then(function(data){ 
     console.log("response: " + JSON.stringify(data, null, 2)); 
     currentProcess.tasks = data.data; 
     return data.data; 
     }); 
    ); 
} 

按順序運行它，只需修改showCurrentTaskForm函數調用API函數和.then()返回的承諾。

showCurrentTaskForm = function showCurrentTaskForm() { 
    console.log("mark"); 
    api.getCurrentProcessInstanceTask() 
     .then(function(result){ 
     setupEmbeddedView(result, 'showTaskForm'); 
     }) 
     .catch(function(e){ 
     //handle the error 
     }); 
}