TypeScript - 在TypeScript中实现的Ajax类

我正在尝试使用TypeScript来编写Ajax类。打字稿码 -TypeScript - 在TypeScript中实现的Ajax类

class Ajax { 
    url: string; 
    xmlData: string; 
    mode: bool; 
    response: string; 
    objHttpReq:any; 

    constructor (postUrl: string, postXml: string, postMode: bool) { 
     this.url = postUrl; 
     this.xmlData = postXml; 
     this.mode = postMode;  
     this.objHttpReq = new XMLHttpRequest(); 
     this.objHttpReq.mode = this.mode; 

     this.objHttpReq.onreadystatechange = this.OnRStateChange; 

     this.objHttpReq.open("Post", this.url, this.mode); 
     this.objHttpReq.send(this.xmlData);   
    }     

    OnRStateChange(){    
     if (this.readyState==4 && this.status==200) 
        //here this refers to Ajax 
     { 
      //alert(xmlhttp.status); 
      if(this.mode == false) 
      { 
       alert(this.responseText); 
      } 
      else 
      { 
       alert(this.responseText); 
      } 
     } 
    } 
}

遵守上面的代码

var Ajax = (function() { 

    function Ajax(postUrl, postXml, postMode) { 
     this.url = postUrl; 
     this.xmlData = postXml; 
     this.mode = postMode; 
     this.objHttpReq = new XMLHttpRequest(); 
     this.objHttpReq.mode = this.mode; 
     this.objHttpReq.onreadystatechange = this.OnRStateChange; 
     this.objHttpReq.open("Post", this.url, this.mode); 
     this.objHttpReq.send(this.xmlData); 
    } 
    Ajax.prototype.OnRStateChange = function() { 
     if(this.readyState == 4 && this.status == 200) { 
     //here this refers XMLHttpRequest object – works fine 
      if(this.mode == false) { 
       alert(this.responseText); 
      } else { 
       alert(this.responseText); 
      } 
     } 
    }; 
    return Ajax; 
})();

问题上面打字稿代码表明错误的JavaScript，因为阿贾克斯类没有readyState的，状态和性能的responseText。在TypeScript中编写Ajax类的正确代码应该是什么？

来源

2013-01-21 skgyan

你摸不着头脑？ –

你只需要添加相应的属性是这样的：

class Ajax { 
    url: string; 
    xmlData: string; 
    mode: bool; 
    response: string; 
    objHttpReq:any; 
    readyState: number; 
    status: number; 
    responseText: string; 

    constructor (postUrl: string, postXml: string, postMode: bool) { 
     this.url = postUrl; 
     this.xmlData = postXml; 
     this.mode = postMode;  
     this.objHttpReq = new XMLHttpRequest(); 
     this.objHttpReq.mode = this.mode; 

     this.objHttpReq.onreadystatechange = this.OnRStateChange; 

     this.objHttpReq.open("Post", this.url, this.mode); 
     this.objHttpReq.send(this.xmlData);   
    }     

    OnRStateChange(){    
     if (this.readyState==4 && this.status==200) 
        //here this refers to Ajax 
     { 
      //alert(xmlhttp.status); 
      if(this.mode == false) 
      { 
       alert(this.responseText); 
      } 
      else 
      { 
       alert(this.responseText); 
      } 
     } 
    } 
}

来源

2013-01-21 14:47:00 Fenton

感谢Steve的回应，但您不认为Ajax类的对象从不使用readyState，status或responseText属性。也许你是对的，但我对答案并不满意。 – skgyan

我建议修改你的类了一下：

在可以调整的构造函数如下：

this.objHttpReq.onreadystatechange =() => this.OnRStateChange();

然后在函数OnRStateChange中可以参考

this.objHttpReq.readyState; 
this.objHttpReq.status; 
this.objHttpReq.responseText;

所以最后你的类将如下所示：

class Ajax { 
    url: string; 
    xmlData: string; 
    mode: bool; 
    response: string; 
    objHttpReq:any; 

    constructor (postUrl: string, postXml: string, postMode: bool) { 
     this.url = postUrl; 
     this.xmlData = postXml; 
     this.mode = postMode;  
     this.objHttpReq = new XMLHttpRequest(); 
     this.objHttpReq.mode = this.mode; 

     this.objHttpReq.onreadystatechange =()=> this.OnRStateChange(); 

     this.objHttpReq.open("Post", this.url, this.mode); 
     this.objHttpReq.send(this.xmlData);   
    }     

    OnRStateChange(){    
     if (this.objHttpReq.readyState==4 && this.objHttpReq.status==200) 
        //here this refers to Ajax 
     { 
      //alert(xmlhttp.status); 
      if(this.objHttpReq.mode == false) 
      { 
       alert(this.objHttpReq.responseText); 
      } 
      else 
      { 
       alert(this.objHttpReq.responseText); 
      } 
     } 
    } 
}

亲切的问候 Ë

来源

2015-10-21 08:56:58 Evgeny

TypeScript - 在TypeScript中实现的Ajax类

回答

相关问题