Comment ajouter une fonction de rappel à un cours javascript?

Question

Le code suivant javascript me donne l'erreur « this.callback n'est pas une fonction

function ajaxRequest() 
{ 
    var httpObject; 

    this.open = open; 
    this.callback = function(){}; 

    function getHTTPObject() 
    { 
     if (window.ActiveXObject) 
      return new ActiveXObject("Microsoft.XMLHTTP"); 
     else if (window.XMLHttpRequest) 
      return new XMLHttpRequest(); 
     else 
     { 
      alert("Your browser does not support AJAX."); 
      return null; 
     } 
    } 

    function onstatechange() 
    { 
     if(httpObject.readyState == 4) 
     { 
      this.callback(httpObject.responseText); 
     } 

    } 


    function open(url, callback) 
    { 
     httpObject = getHTTPObject(); 
     if (httpObject != null) 
     { 
      httpObject.open("GET", url, true); 
      httpObject.send(null); 
      this.callback = callback; 
      httpObject.onreadystatechange = onstatechange; 
     } 
    } 
} 

pourquoi ne traite pas la méthode ouverte le paramètre de rappel en fonction?

Si elle le fait alors pourquoi Je ne peux pas l'appeler en fonction OnStateChange?

Comment puis-je faire ce travail?

Answer 1

La raison en est que, parce que onstatechange est appelé En tant que gestionnaire d'événement, le pointeur this indique probablement l'objet sur lequel l'événement a été déclenché, et non l'objet ajaxRequest, comme vous le souhaitez. La réécriture suivante stocke la variable this dans une variable appelée that dans le contexte d'exécution auquel la fonction onstatechange() a accès. Cela devrait guérir le problème. Le plus long et le plus court de tout cela, c'est si vous ne comprenez pas complètement les contextes de fermeture et d'exécution Javascript, et même si vous le faites, il vaut mieux utiliser un framework pour faire vos requêtes AJAX. jQuery et Prototype sont de bons choix.

function ajaxRequest() 
{ 
    var httpObject; 

    this.open = open; 
    this.callback = function(){}; 
    var that = this; 

    function getHTTPObject() 
    { 
     if (window.ActiveXObject) 
       return new ActiveXObject("Microsoft.XMLHTTP"); 
     else if (window.XMLHttpRequest) 
       return new XMLHttpRequest(); 
     else 
     { 
       alert("Your browser does not support AJAX."); 
       return null; 
     } 
    } 

    function onstatechange() 
    { 
     if(httpObject.readyState == 4) 
     { 
       that.callback(httpObject.responseText); 
     } 

    } 


    function open(url, callback) 
    { 
     httpObject = getHTTPObject(); 
     if (httpObject != null) 
     { 
       httpObject.open("GET", url, true); 
       httpObject.send(null); 
       this.callback = callback; 
       httpObject.onreadystatechange = onstatechange; 
     } 
    } 
}