web-dev-qa-db-fra.com

Javascript fonction anonyme

Je lisais des sources JS sur Twitter - pour améliorer ma base de connaissances sur JS, lorsque je suis tombé sur l'étrange façon d'appeler une fonction anonyme:

!function( $ ) {
    ...
}( window.jQuery );

... et ça marche! :)

Il est évident pour tout le monde que ceci:

function ( $ ) { ... } ( window.jQuery )

ne fonctionne pas (erreur de syntaxe), alors que celle-ci est correcte:

(function ( $ ) { .... })( window.jQuery )

Quelqu'un peut-il s'il vous plaît expliquer cette magie (pourquoi l'affaire avec !function fonctionne)?

47
Konstantin Likhter

Lorsque le mot clé function est rencontré dans une position d'instruction (en tant que premier jeton dans une instruction), la déclaration de fonction est exprimée sous la forme d'une instruction de fonction . Les instructions de fonction sont placées en haut de la portée, ne peuvent pas être invoquées immédiatement et doivent avoir un nom.

Lorsque le mot clé est rencontré dans une position d'expression (c'est-à-dire pas en tant que premier jeton dans une instruction, dans votre exemple, ! est le premier jeton), la déclaration de la fonction est exprimée sous la forme d'une fonction expression , qui peut être anonyme et renvoie la valeur de la fonction nouvellement créée. Puisqu'il renvoie la valeur de la fonction nouvellement créée, vous pouvez immédiatement l'invoquer en ajoutant une parenthèse à la suite.

Le fait de placer la déclaration entre parenthèses a le même effet, mais est plus courant que de le préfixer avec un ! ou un +:

(function () {
    ...
}());
66
Felix Loether

La seconde forme function () {} est un statement. L'opérateur ! le convertit en expression. Vous trouverez également des cas où les utilisateurs utilisent - ou + avant le mot clé function.

Lorsque vous avez une expression évaluant une fonction, vous pouvez appeler cette fonction à l'aide de l'opérateur ().

Une autre façon (peut-être plus facile à comprendre) d’atteindre le même effet est d’utiliser un autre ensemble de parenthèses:

( function(x) { body; } )(arg);

En plaçant la fonction à l'intérieur de la parenthèse, vous la convertissez à nouveau en une expression qui correspond à une fonction. Cette fonction est appelée avec arg en argument.

6
nimrodm

Pour ce qui est du point d’exclamation, ce n’est pas magique… .. Il convertit le résultat en vrai/faux.

Votre problème peut être que votre fonction anonyme contient une erreur.

0
Shane

cela ressemble à un bogue de syntaxe javascript: 

une fonction nommée peut être une instruction, cependant, une fonction anonyme la considère simplement comme une expression.

Pro: Vous pouvez faire function() { ... }()

Con: Vous ne pouvez pas faire function() { ... }

Mais pourquoi les gens voudraient-ils définir une fonction anonyme sans l'invoquer? Donc, le problème n'est pas vraiment un problème.

0
Stone Zhong