SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Wizard cranial-bore's Avatar
    Join Date
    Jan 2002
    Location
    Australia
    Posts
    2,634
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    what does this syntax mean?

    Below is a code sample from the basic YUI Drag Drop example

    I was wondering what the purpose of wrapping the code in parenthesis was?
    Code JavaScript:
    <script type="text/javascript"> 
        (function() { 
            var dd, dd2, dd3; 
            YAHOO.util.Event.onDOMReady(function() { 
                dd = new YAHOO.util.DD("dd-demo-1"); 
                dd2 = new YAHOO.util.DD("dd-demo-2"); 
                dd3 = new YAHOO.util.DD("dd-demo-3"); 
            }); 
        })(); 
    </script>

    I'm aware of declaring object or array literals using {} and [] respectively, but not this syntax.

    Thanks

  2. #2
    SitePoint Enthusiast
    Join Date
    Aug 2006
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The outer function will call itself straight away, and things declared with 'var' will only be 'in scope' within the function, making sure they don't conflict with anything else that might be going on.

  3. #3
    SitePoint Wizard cranial-bore's Avatar
    Join Date
    Jan 2002
    Location
    Australia
    Posts
    2,634
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    So it's essentially a function literal?

    I guess it cannot be called again because it hasn't been given a name to be called with.

  4. #4
    SitePoint Wizard stereofrog's Avatar
    Join Date
    Apr 2004
    Location
    germany
    Posts
    4,324
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Function in JS is a value like any else, "function(){...}" is a constant of type Function, just like "125" is a constant of type Number. Everywhere where a value of type X is allowed, JS allows an arbitrary expression of type X. "()" ("call") is a operator that expect an expression of type Function on the left, just like e.g. unary "-" is a operator that expects Number on the right. Compare:

    Code:
    -x; // Number variable
    -123; // Number constant 
    -(123 + x); // Number expression
    
    foo() // Function variable
    (function() {...})() // Function constant
    (someObj.createFunction())() // Function expression

  5. #5
    Obey the Purebreed trib4lmaniac's Avatar
    Join Date
    Dec 2004
    Location
    Cornwall, UK
    Posts
    594
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Also, the parentheses wrapping the function are required.
    Code JavaScript:
    (function() { return 42; })()   // Returns 42.
    function() { return 42; }()     // Syntax error.

  6. #6
    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 trib4lmaniac View Post
    Also, the parentheses wrapping the function are required.
    Actually, no. "functon() {...}()" is a syntax error not because of the function literal, "()" alone would be syntax error as well. "function() {...} (x)" is a valid syntax, although is doesn't work as one can expect.

  7. #7
    Founder of Primal Skill Ltd. feketegy's Avatar
    Join Date
    Aug 2006
    Posts
    482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    function() {
       var a = 10;
    }
    But still the variable a will remain in the function scope, it won't conflict with anything no?
    If so then why the extra () wrapping?


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
  •