(...()) vs. (...)() dans les fermetures javascript

Question

Je sais que c'est idiot, mais il y a une différence entre ça :

(function() {  
    var foo = 'bar';  
})();

et ça ?

(function() {  
    var foo = 'bar';  
}());

JSLint nous dit de Move the invocation into the parens that contain the function mais je n'en vois pas l'utilité.

Edita: Les réponses sont trop cool. ~function El JSHint de même que la préférence de jQuery pour les (/***/)(); et l'explication de Crockford ! Je pensais que j'allais juste avoir une réponse du genre "c'est la même chose".
Vous décidez de la meilleure grâce aux upvotes et je la coche.

Answer 1

Il n'y a pas de différence. Les deux sont des moyens valides pour que l'analyseur JavaScript traite votre fonction comme une fonction expression au lieu d'un déclaration .

Notez que + y ! fonctionneront également, et sont parfois utilisés par les minifieurs pour gagner un caractère de taille :

+function() {  
    var foo = 'bar';  
}();

!function() {  
    var foo = 'bar';  
}();

EDITAR

Comme le souligne @copy, pour être complet, ~ y - fonctionnera également.

-function() {  
    var foo = 'bar';  
}();

~function() {  
    var foo = 'bar';  
}();

Answer 2

Cette violation de JSLint existe parce que Douglas Crockford dit que la version hors-parenthèses ressemble à des "dog balls".

Vous pouvez l'entendre en parler dans cette vidéo :

Je pense que ça a l'air idiot, parce que ce dont on parle c'est de l'invocation entière, mais on a ces choses qui pendent à l'extérieur et qui ressemblent à des... balles de chien.

Il suggère que les parenthèses à l'intérieur aider le lecteur à comprendre que la déclaration entière est une fonction expression plutôt qu'une déclaration.

Answer 3

Non, je ne crois pas qu'il y ait de différence. Je préfère personnellement la première (et jQuery et. al. semblent être d'accord) mais les deux fonctionnent de manière identique dans tous les moteurs que j'ai testés.

De plus, JSLint est parfois un peu trop strict. JSHint pourrait être un peu mieux à cet égard.

Answer 4

Une autre forme de l'expression de fonction immédiatement invoquée qui permet de capturer une valeur de retour est :

1 && function fnName(params){ return "some result"; }(someParams)

Autre remarque utile, si vous utilisez un IIFE pour créer une portée privée tout en passant la valeur de retour comme paramètre à une autre fonction, vous n'avez pas besoin d'un habillage spécial. Je trouve cela utile pour créer une portée privée pour les accesseurs, comme ceci :

Object.defineProperty(someObj, 'myProp', function(privateVal){
  return { get: function( ){ return privateVal },
           set: function(v){ privateVal = v    } }
}('default'));