Memory-leak at a wrapped XMLHttpRequest function

Question

I wrote the following :

function ao(){
this.count=0;
this.flag=0;
this.tmr=0;
var self = this;
this.make=function(){
    //log("before: "+this.url+" "+this.xhr);
    self.xhr = (window.XMLHttpRequest)
        ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
    //log("after: "+this.xhr);
}
this.request = function (method, url, sendStr, delay){
    this.delay=delay;
    if(delay && self.tmr==0){
        self.start();
    }
    if(self.flag==0){
        this.method = method;
        this.url = url;
        this.sendStr = sendStr;
        self.make();
        this.xhr.open(method, url, true);
        this.xhr.onreadystatechange = this.stateChange;
        this.xhr.onabort=this.rrr;
        this.xhr.onerror=this.rrr;
        this.xhr.setRequestHeader("Cache-Control","no-cache");
        this.xhr.send(sendStr);
    }
};
this.repeat=function(){
    if(this.flag==0){
        this.flag=1;
        this.count++;
        this.xhr.open(self.method, self.url+"?"+this.count, true);

        this.xhr.onreadystatechange = this.stateChange;
        this.xhr.onabort=this.rrr;
        this.xhr.onerror=this.rrr;
        this.xhr.setRequestHeader("Cache-Control","no-cache");

        this.xhr.send(self.sendStr);
    }
    return 0;
}
this.stop=function(){
    window.clearInterval(this.tmr);
    this.tmr=0;
    this.flag=0;
}
this.start =function(){
    self.tmr=window.setInterval(function(){self.repeat();},self.delay);
}
this.stateChange = function(){
    if (self.xhr.readyState <= 1){
        return;
        self.log("404 errors");
    } else {
        if (self.xhr.readyState == 4 && self.xhr.status == 200){
            self.resp = self.xhr.responseText;
            if (self.callback != null)
                self.callback(self.xhr.readyState, self.xhr.status);
            else {
                if (self.getHTML) {
                    self.getHTML(self.resp);
                    this.xhr=null;
                } else {
                    if (self.xhr.readyState == 4 && self.xhr.status == 200){
                        self.parseJSON();
                        self.traverse();
                        this.ro=null;
                        this.xhr=null;
                    }
                }
            }
        }
    }
    self.flag=0;
    return 0;
};

and in windows ff there is a memory leak. I spent days trying to fix it, but I'm stumped.

The following works :

var x=new ao();
ao.request("POST","/cgi-bin/sdf.cgi","text",1000)

and after every 1000 miliseconds if previous request is done, it makes new request.

Answer 1

Developers should also take precautions when it comes to using the onreadystatechanged event of an XMLHttpRequest object. If the handler is a closure that closes over a reference to the same XMLHttpRequest object, another circular dependency can be created. This isn't necessairly detected by the above tool because the object is not part of the DOM. Link