AJAX clarification

[christopherw248]

In their sample code, the declaration var xmlHttp is made outside of any function. However this is defined in the GetXmlHttpObject method and returned to the calling function.Is this declaration, outside of any function necessary? Is it's position important, relative to it needing to be evaluated before some other function?

var xmlHttpfunction GetXmlHttpObject () {   var xmlHttp = null;   try {      // Firefox, Opera 8.0+, Safari      xmlHttp=new XMLHttpRequest();   } catch (e) {      // Internet Explorer      try {    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");    }  catch (e)    {    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");    }  }return xmlHttp;}

[jesh]

Its location, in that example, is important.Declaring that variable outside of any function makes that a global variable that all functions can access. The reason this is important is when it comes to the callback functions (the readystatechange handler):

xmlHttp.onreadystatechange = stateChanged;

function stateChanged () {    if (xmlHttp.readyState == 4) { 	  document.getElementById ("txtHint").innerHTML = xmlHttp.responseText;   }}

If xmlHttp wasn't declared outside of the showCD function, then the stateChanged function wouldn't have access to it and the script would fail.

[christopherw248]

I see. How does this work with the scope? Does this mean that the xmlHttp object declared outside is the same one that gets modified within the functions?I think I get it. Just need to change my perception a bit.I sure appreciate your response.

Its location, in that example, is important.Declaring that variable outside of any function makes that a global variable that all functions can access. The reason this is important is when it comes to the callback functions (the readystatechange handler):

xmlHttp.onreadystatechange = stateChanged;

function stateChanged () {    if (xmlHttp.readyState == 4) { 	  document.getElementById ("txtHint").innerHTML = xmlHttp.responseText;   }}

If xmlHttp wasn't declared outside of the showCD function, then the stateChanged function wouldn't have access to it and the script would fail.

[jesh]

How does this work with the scope? Does this mean that the xmlHttp object declared outside is the same one that gets modified within the functions?

When the variable is declared outside the functions with:

var xmlHttp;

Then anywhere else in the code that references "xmlHttp" will be referencing that global variable.However, when you look at the GetXmlHttpObject function, a new local variable is created with the same name:

function GetXmlHttpObject (){	var xmlHttp = null;	...	return xmlHttp;}

That xmlHttp variable, because it is declared inside of a function with "var" in front of it, is local to that particular function and is completely separate from the globally declared xmlHttp variable. If instead of what is written above, the function looked like this:

function GetXmlHttpObject (){	xmlHttp = null;	...	return xmlHttp;}

It too would be using the globally declared xmlHttp variable.

[christopherw248]

Great. I probably should have been able to figure that one. For some reason I was making it harder than it seemed. Thanks again.Chris

When the variable is declared outside the functions with:

var xmlHttp;

Then anywhere else in the code that references "xmlHttp" will be referencing that global variable.However, when you look at the GetXmlHttpObject function, a new local variable is created with the same name:

function GetXmlHttpObject (){	var xmlHttp = null;	...	return xmlHttp;}

That xmlHttp variable, because it is declared inside of a function with "var" in front of it, is local to that particular function and is completely separate from the globally declared xmlHttp variable. If instead of what is written above, the function looked like this:

function GetXmlHttpObject (){	xmlHttp = null;	...	return xmlHttp;}

It too would be using the globally declared xmlHttp variable.

[jesh]

Thanks again.

Any time. :)Just an additional note, I personally try to avoid confusing stuff like this by choosing different variable names.

var xmlHttp;  // this would be the global variablefunction GetXmlHttpObject(){	var object;  // this would be the local variable	...	return object;}xmlHttp = GetXmlHttpObject();