SitePoint Sponsor

User Tag List

Results 1 to 13 of 13
  1. #1
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Different function syntax

    Is there any difference (apart fromt the syntax) on the following 2 functions? Are there any benefits from one to the other?

    Code:
    function x()
    {
    	return 10;
    }
    
    x = function()
    {
    	return 10;
    }

  2. #2
    SitePoint Evangelist SpaceFrog's Avatar
    Join Date
    Jan 2005
    Location
    Outerspace
    Posts
    511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    never saw the second one ...
    but it looks like assingning a function to a variable ...
    what would be tha advantage of that ?

  3. #3
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That is exactly what my question is about

  4. #4
    SitePoint Addict
    Join Date
    May 2004
    Location
    Europe
    Posts
    216
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The first is a function declaration, the second is a function expression. Declarations are processed before the script actually starts, so this is perfectly ok:
    Code:
    window.onload=main;
    function main() {
    // Do something
    }
    Compare this to a function expression, which doesn't work:
    Code:
    window.onload=main;
    main = function() {
    // Do something
    }
    OTOH, function expressions have the sometimes useful advantage that you can combine the definition of a function and its first call into one line:
    Code:
    (x = function() { /* Do something */ })();

  5. #5
    SitePoint Evangelist SpaceFrog's Avatar
    Join Date
    Jan 2005
    Location
    Outerspace
    Posts
    511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    what about passing params to the function does second syntax allow that ?

  6. #6
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    never saw the second one ...
    but it looks like assingning a function to a variable ...
    what would be tha advantage of that ?
    So, you can pass functions as a parameter to another function. Here is an example in a current thread:

    http://www.sitepoint.com/forums/showthread.php?t=245107

  7. #7
    SitePoint Evangelist SpaceFrog's Avatar
    Join Date
    Jan 2005
    Location
    Outerspace
    Posts
    511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    talking about params... you can in fact pass params with second sytax by using ...
    Code:
    x.arguments

  8. #8
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    what about passing params to the function does second syntax allow that ?
    The first syntax is a function literal, and the second syntax is the variable x storing a reference to a function. Function literals and references can both be passed around:
    Code:
    function g(fnF)
    {
    	fnF();
    	alert("goodbye");
    }
    
    g( function(){alert("hello")} ); //function literal passed to a function
    
    var x = function(){alert("hello")};  //create a reference to an anonymous function
    g(x); //function reference passed to a function

  9. #9
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Saturn
    The first is a function declaration, the second is a function expression. Declarations are processed before the script actually starts, so this is perfectly ok:
    Code:
    window.onload=main;
    function main() {
    // Do something
    }
    Compare this to a function expression, which doesn't work:
    Code:
    window.onload=main;
    main = function() {
    // Do something
    }
    You aren't thinking about something(?) correctly. The reason your example doesn't work is because you are trying to access the variable main before it is defined--it has nothing to do with the difference between a function literal and a function reference. This certainly does work:
    Code:
    var main = function()
    {
    	alert("doSomething");
    }
    
    window.onload = main;

  10. #10
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Literals v. variables:

    string literal: "hello world"
    string variable: var x = "hello world"

    array literal: [10, 20, 30]
    array variable: var x = [10, 20, 30]

    object literal: {"name":"Sally", "age":21, "favorite_color":"blue"}
    object variable: var x = {"name": "Sally", "age": 21, "favorite_color": "blue"}

    function literal: function a(){alert("hello")} or function(){alert("hello")}
    function variable: var x = function a(){alert("hello")}
    Code:
    var x = function a(){alert("hello")};
    x();
    
    x = function(){alert("goodbye")};
    x();
    
    x = function(){return 20};
    function y(fnF, iNum)
    {
    	return fnF() + iNum
    }
    
    alert(y(x, 30));
    regex literal: /[abc]/ --> matches a string with either an a, b, or c in it.
    regex variable: var x = /[abc]/;
    Code:
    var x = /[abc]/;
    alert(x.test("apple"));  //true
    
    x = /[xyz]/;
    alert(x.test("apple"));  //false

  11. #11
    SitePoint Enthusiast
    Join Date
    Jan 2004
    Location
    Edinburgh, Scotland
    Posts
    90
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    One of the main uses of assigning a function to a variable is so that you can create an object method:

    myCustomObject.prototype.size = new function()
    {
    // calculate object size
    return x
    }
    Throw away your Calculator -
    get instant results from www.calcResult.com

  12. #12
    SitePoint Wizard stereofrog's Avatar
    Join Date
    Apr 2004
    Location
    germany
    Posts
    4,324
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by omnicity
    One of the main uses of assigning a function to a variable is so that you can create an object method:

    myCustomObject.prototype.size = new function()
    {
    // calculate object size
    return x
    }
    You dont need 'new' here.

  13. #13
    SitePoint Enthusiast
    Join Date
    Apr 2004
    Location
    Michigan
    Posts
    96
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by 7stud
    You aren't thinking about something(?) correctly. The reason your example doesn't work is because you are trying to access the variable main before it is defined--it has nothing to do with the difference between a function literal and a function reference. This certainly does work:
    Code:
    var main = function()
    {
    	alert("doSomething");
    }
    
    window.onload = main;

    The whole point of his post is to state that the order doesn't matter in the first example, and does matter in the second. Yes that does work, and that was the point. In order for that to work you have to put them into that order.


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
  •