this pointer

[exoscale]

in the following script ~this pointer~(self variable) is used to bind
XHR to the object that calls the function. but i am wondering why it
is required. anonymous function assigned to the onreadystatechange
event method could create a closure that would make xmlHttpReq
accessible even XHR is not bound to anything, i've tested this
situation if not made some mistake. XHR does not seem to be destroyed when the function exits as its called asynchronously It does not make sense in this simple code but may be meaningfull in an OO approach as multiple methods access the XHR object. Am i right? So what is the semantic of this usage?
thanks

function xmlhttpPost(strURL) { 
    var xmlHttpReq = false; 
    var self = this; 
    // Mozilla/Safari 
    if (window.XMLHttpRequest) { 
        self.xmlHttpReq = new XMLHttpRequest(); 
    } 
    // IE 
    else if (window.ActiveXObject) { 
        self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    self.xmlHttpReq.open('POST', strURL, true); 
    self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x- 
www-form-urlencoded'); 
    self.xmlHttpReq.onreadystatechange = function() { 
        if (self.xmlHttpReq.readyState == 4) { 
            updatepage(self.xmlHttpReq.responseText); 
        } 
    } 
    self.xmlHttpReq.send(getquerystring()); 
}

http://www.degraeve.com/reference/simple-ajax-example.php

[~s.o.s~]

The this pointer is not compulsory. Try it out without the 'this' and it would still work out to be fine. Since this function is executed in the context of some form element (text box in the example given below), 'this' here refers to the element under consideration.

Read this for more on this in javascript.

function ajaxFunction(strURL) { 
    var xmlHttpReq = false; 
    var self = this; 
    // Mozilla/Safari 
    if (window.XMLHttpRequest) { 
        self.xmlHttpReq = new XMLHttpRequest(); 
    } 
    // IE 
    else if (window.ActiveXObject) { 
        self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    self.xmlHttpReq.open('POST', strURL, true); 
    self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x- 
www-form-urlencoded'); 
    self.xmlHttpReq.onreadystatechange = function() { 
        if (self.xmlHttpReq.readyState == 4) { 
            updatepage(self.xmlHttpReq.responseText); 
        } 
    } 
    self.xmlHttpReq.send(getquerystring()); 
} 

<form name="myForm">
Name: <input type="text" onkeyup="ajaxFunction(time.jsp);" name="username" />
Time: <input type="text" name="time" />
</form>

[exoscale]

thanks for the answer SOS. but the onkeyup just calls the function in your example code. so -this- refers to the global (window) object, not the textbox. as i stated before i know that it is not required to bind the XHR to some object by using this. however i've remembered when referred to quirksmode article that -this- in the example does not bind XHR to the object which invokes the function, but binds it to the global object (window).
in this case, xmlHttpReq becomes a global variable although not defined as a global one. it is arguable that it would make sense or not.

i finally conclude that this sample is crippled from a working code that everything makes sense but removed parts makes -this- usage not so meaningful in the example code.

[MattEvans]

If Javascript's object lifecycle is anything like Java's; objects created using 'new' stay resident even after they go out of the scope of the function that called new, provided something else is referencing that object somewhere.. perhaps, the XMLHTTP objects do some kind of forced binding to a single static controller object whenever open() is called... even if they don't; try:

function Thing()
{
  var myself = this;
  window.setTimeout(function(){myself.say_something();},100);
  this.say = "hello there";
  this.say_something = function()
  {
    alert( this.say );
  }
}

function something()
{
  thing = new Thing( );
  return;
}

something( );
alert('did something');

In Opera, I get 'did something' and then 'hello there'.

There's a very weak binding in that the 'myself' provided in the function created for the ( also asyncrounous ) window.setTimeout( ) function refers to the instantiated 'Thing'. That's clearly enough to keep the object alive for at least until the timeout clicks... I'm sure there is some such similar behind-the-scenes binding going on somewhere in XMLHTTP.open( ), because the XMLHTTP has to be 'connected' (pardon the pun) to something that calls its onreadystatechange when the readystate changes; that will keep it from being GC'd.