SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Jan 2010
    Posts
    51
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    variable = function() code explanation

    Hi guys, could you explain this code to me please.

    xmlhttp.onreadystatechange=function()
    {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
    }

    if it xmlhttp.onreadystatechange equals the result of the function than why is there no return? am i on the right track or completely off?

    Thanks

  2. #2
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    What makes you think the result of a function is being assigned? Take a look at this example:

    Code:
    function calc(x, y) 
    { 
        return x+y;
    }
    
    var result = calc(1,2);
    alert(result);
    
    result = function(x,y) { return x+y; };
    alert(result);
    In order to get the result of a function, you have to execute the function. How do you execute a function? Like this:

    Code:
    calc(1,2);
    Or like this:

    Code:
          var result = function calc(x, y) 
          { 
            return x+y;
          }(1,2);
    In both cases, the part that executes the function is: (1,2). The parentheses are the function execution operator---except when the parentheses appear in the middle of a function definition, like here:
    Code:
    function calc(x, y)
    {
      return x+y;
    }
    The parentheses there do not execute the function.

    So what does your code example do? Look at this example:
    Code:
          function calc(x, y) 
          { 
            alert(x+y);
          }
          
          do_stuff = calc;
          do_stuff(1, 2);

    Your example actually assigns the function itself to a special variable. Then when a specific event takes place (i.e. the ready state changes), js executes whatever function is assigned to that variable. In js, you can assign numbers or strings to variables--and you can assign functions to variables too. In fact, the function name in the function definition is just a variable that stores the function itself:


    Code:
    function do_stuff(x, y)
    {
      return x() + y()
    }
    
    
    function func1()
    {
      return 2;
    }
    
    function func2()
    {
      return 3;
    }
    
    alert( do_stuff(func1, func2) );

  3. #3
    Non-Member
    Join Date
    Apr 2011
    Location
    no fixed address
    Posts
    851
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by wazzaday View Post
    am i on the right track or completely off?
    I think you're a little off course

    What you have there is a snippet of some code for an AJAX object.

    Basically -

    1)


    Code:
    xmlhttp.onreadystatechange=function()
    {
       if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
          document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
        }
    }
    The red code is assigning a function to the onreadystatechange property of the ajax object (xmlhttp). The code for the function is between the outer {}

    2) While the ajax request is being processed on the server the ajax object's readystate and status properties are being periodically updated and when the 2 equal 4 and 200 respetively, the ajax request has finished its processing on the server and has sent back any output to the browser. Any output from the processing on the server is stored in the ajax object's responseText property.

    3) When the ajax request has completed

    Code JavaScript:
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

    assigns the requested output from the ajax request (could be a list of names from a db or whatever) to the innerHTML property of the "myDiv" element and so displays the results of ajax request in the user's browser.


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •