How can I declare my self-service feature?

Question

I saw Javascript self-starting functions written as follows:

(function () { // foo! })(); 

But I also saw how they wrote like this:

 (function () { // bar! }()); 

Syntactically they do the same. My personal habit is the first format, actually, but is there a difference between the two that I should be aware of? How are browser kinks or something else?

One very trivial thing, for example, is that the second format should work reliably, then this will mean that something like this should also be possible:

 function () { // shut the front door! saved two characters right there! }(); 

This greatly affects readability.

Answer 1

At first:

There was, as you expected, absolutely no difference between the first version of your self-naming anonymous function. No browser links, quirks, just boil down to personal preference (Douglas Crockford calls the latter form “dog balls” by the way).

Secondly:

 function() { }() 

will not work on design, as this statement creates a function statement / declaration. You need a function expression to call yourself immediately. There are several things you can do to create a function expression. Including the whole sentence in parentheses is one way, but you can also write

 !function() { }() 

or

 +function() { } 

All these operators will make an expression.

Answer 2

The first two are identical, but if I remember correctly, one of them is preferable to jsLint (I think it is the second).

The third causes a syntax error in most interpreters, but there are other options:

 !function() { alert('I'm executing myself!'); }(); var noname = function() { alert(noname); // undefined! }(); 

You can replace ! on + or - (None of them will make Crockford happy)

Answer 3

This is basically a congressional issue.

(function () {}()); <- one less stack frame before execution (possible)

(function () {})(); <- executed outside the bracket, so one small frame before execution, although I do not like this style, IMO it is visually disabled.

function () {}(); <- this is simply IMO wrong practice, it is not immediately obvious that this is IIFE , which is mainly due to agreement, but this problem also has a problem: if you forget the semi-colony before the expression, then in some conditions quietly set the variables to undefined.

Example:

 var x = 0, y = 1, z = 3, function () { alert("Z is now undefined, instead of throwing a syntax error."); }(); 

Strike>

As mentioned by Andre Meinhold, this is not in the position of expression.

Answer 4

Pragmatically, JSLint will complain about the first and prefer the second format. In addition, personal preferences and consistency are really important here.

The third format will result in a SyntaxError, so you cannot use it. This is because you are creating a function declaration, not a function expression. This is a function expression that you call when using the instant function template.

Answer 5

Crockford says use (function () {...}()) .

It’s just a stylistic choice, but it’s in the interest of the community to agree to an agreement and (at the risk of starting a fiery war), why not use Crockford?

Answer 6

Also, keep in mind that (function () { }()); adds potential confusion. Because in a long function, someone, not paying attention, can see two closing parentheses and only one open.