$。推薦爲成員變量

在面向對象的語言背景下，我試圖學習一些jquery，並圍繞異步調用進行打包。我的意圖是創建一個JavaScript對象來包含異步API調用的結果，並且能夠詢問所述對象是否已完成加載。

我一直在嘗試使用jQuery的Deferred's來完成它，並且我沒有任何問題需要使用片段來處理文檔示例，但它不會按照我期望的順序執行，類。

如何使用$ .Deferred作爲成員變量創建javascript對象？

（在我的連接代碼超時是模仿API調用延遲）

<!DOCTYPE html> 
<html> 
    <body> 
    <script src="jquery-3.1.1.js"></script> 
    <script> 
     //top level 
     var isdone = false; 
     var def = $.Deferred(); 

     $.when(def).done(function() { 
      var msg = "checking topLevel isdone " + isdone; 
      console.log(msg); 
      $("body").append("<p>" + msg + "</p>"); 
     }) 

     var delayedCall = function() { 
      setTimeout(function() { 
      //resolve after 5 seconds 
      isdone = true; 
      def.resolve(); 
      }, 1000); 
     } 
     delayedCall(); 



     //inside function 
     function DelayedObject() 
     { 
      this.defThis = $.Deferred(); 
      var defVar = $.Deferred(); 
      this.delayedObjCall = function() 
      { 
      setTimeout(function() 
      { 
       //resolve after 5 seconds 
       isdone = true; 
       this.def.resolve(); 
      }, 1000); 
      } 
      this.delayedObjCall(); 
      this.getStatusThis = function() 
      { 
      return this.def; 
      } 
      this.getStatusVar = function() 
      { 
      return this.def; 
      } 
     } 

     delObj = new DelayedObject(); 
     $.when(delObj.getStatusThis()).done(function() { 
      var msg = "checking delObj (this) isdone " + isdone; 
      console.log(msg) 
      $("body").append("<p>" + msg + "</p>"); 
     }); 
     $.when(delObj.getStatusVar()).done(function() { 
      var msg = "checking delObj (var) isdone " + isdone; 
      $("body").append("<p>" + msg + "</p>"); 
      console.log(msg) 
     }); 

     $(window).on("load", function() 
     { 
      var msg = "<p>" + " Page loaded " + "</p>"; 
      $("body").append(msg); 
      console.log(msg); 
     }); 
     </script> 
    </body> 
    </html>

結果

checking delObj (this) isdone false 

checking delObj (var) isdone false 

Page loaded 

checking topLevel isdone true

來源

2017-02-11 Schaki

'this.def'，'this.defThis'，'defVar' ???你想*一個*延期。 – Bergi

我知道，我在這裏包括多個以更好地說明我的問題。可能在代碼註釋中提到過雖然 – Schaki

的一些問題：

你指錯了對象/變量在某些地方（this.def不存在，this.defThis和defVar從未使用）
this沒有在超時回調函數定義的（或者是在window馬虎模式），因此需要使用該溶液（多種可能性，例如bind）
你永遠不解決defVar
您可以使用一個變量isdone，這樣就意識到，一旦它被設置爲true它仍然true並說一些關於其他承諾。

在這裏被校正代碼（簡化爲：省略了文檔內容的變化）：

var isdone = false; 
 
var def = $.Deferred(); 
 

 
$.when(def).done(function() { 
 
    console.log("checking topLevel isdone " + isdone); 
 
    isdone = false; // set back to false 
 
}); 
 

 
var delayedCall = function() { 
 
    setTimeout(function() { 
 
    isdone = true; 
 
    def.resolve(); 
 
    }, 500); // Half a second 
 
} 
 
delayedCall(); 
 

 
//inside function 
 
function DelayedObject() { 
 
    this.defThis = $.Deferred(); 
 
    var defVar = $.Deferred(); 
 
    this.delayedObjCall = function() { 
 
    setTimeout(function() { 
 
     //resolve after 5 seconds 
 
     isdone = true; 
 
     this.defThis.resolve(); // refer to the correct object 
 
    }.bind(this), 1000); // provide the correct context with bind 
 
    // Also resolve the other deferred: 
 
    setTimeout(function() { 
 
     //resolve after 5 seconds 
 
     isdone = true; 
 
     defVar.resolve(); 
 
    }.bind(this), 1500); //... a bit later 
 
    } 
 
    this.delayedObjCall(); 
 
    this.getStatusThis = function() { 
 
    return this.defThis; // return correct object 
 
    } 
 
    this.getStatusVar = function() { 
 
    return defVar; // return correct object 
 
    } 
 
} 
 

 
delObj = new DelayedObject(); 
 
$.when(delObj.getStatusThis()).done(function() { 
 
    console.log("checking delObj (this) isdone " + isdone); 
 
    isdone = false; // set back to false 
 
}); 
 
$.when(delObj.getStatusVar()).done(function() { 
 
    console.log('checking delObj (var) isdone ' + isdone) 
 
    isdone = false; // set back to false 
 
}); 
 

 
$(window).on("load", function() { 
 
    console.log('Page loaded'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

來源

2017-02-11 13:27:00 trincot

bind（）是我正在尋找的，thx！ – Schaki

$。推薦爲成員變量

回答

相關問題