Immediately Executing Functions

By  on  

JavaScript is full of nifty little tricks to accomplish tasks with less code.  One of those tricks is immediately executing functions.  We oftentimes see this pattern for executing anonymous functions to limit variable scope:

(function() {
	console.log('executed!');

	// Do processing here

})();

What many developers don't know is that this code can be shorted by using a ! before the anonymous function:

!function() {
	console.log('executed!');

	// Do processing here	
}()

The function above executes immediately, just as the first snippet did.  One caveat:  the immediately executing function always returns false.  If you desire the result of the anonymous function, you wont want to use this second pattern.

Ben Alman has created an excellent, detailed writeup on the subject and if you want to learn more, be sure to visit his post!

Recent Features

  • By
    Introducing MooTools Templated

    One major problem with creating UI components with the MooTools JavaScript framework is that there isn't a great way of allowing customization of template and ease of node creation. As of today, there are two ways of creating: new Element Madness The first way to create UI-driven...

  • By
    Create a CSS Cube

    CSS cubes really showcase what CSS has become over the years, evolving from simple color and dimension directives to a language capable of creating deep, creative visuals.  Add animation and you've got something really neat.  Unfortunately each CSS cube tutorial I've read is a bit...

Incredible Demos

  • By
    Animated AJAX Record Deletion Using jQuery

    I'm a huge fan of WordPress' method of individual article deletion. You click the delete link, the menu item animates red, and the item disappears. Here's how to achieve that functionality with jQuery JavaScript. The PHP - Content & Header The following snippet goes at the...

  • By
    MooTools onLoad SmoothScrolling

    SmoothScroll is a fantastic MooTools plugin but smooth scrolling only occurs when the anchor is on the same page. Making SmoothScroll work across pages is as easy as a few extra line of MooTools and a querystring variable. The MooTools / PHP Of course, this is a...

Discussion

  1. Bruce Williams

    Because not quite enough people pulled out their hair on encountering the function(){…}() syntax.

  2. The first is not exactly valid. The right call has the call-parentheses inside the container parentheses.

    (function() { ... code ... }())
    

    I think the ! is works with call-parentheses too. So it’s not shorter.

    > !function(){console.log('asd')}
    false
    > !function(){console.log('asd')}()
    asd
    true
    > function(){console.log('asd')}()
    asd
    undefined
    > (function(){console.log('asd')}())
    asd
    undefined
    >
    
  3. Chris

    I think such oddities should be removed from the language.

  4. James Fishwick

    What would ever be the argument for doing this? A Obfuscated Javascript Code Contest?

  5. Why even use such a function? I don’t get it. If you want code to execute immediatly, just write it outside a ‘function’. What’s the point of an anonymous function you can’t call later on for reusability? Or am I missing something?

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!