JavaScript mais sinal na frente da expressão da função

868

Estive procurando informações sobre funções imediatamente invocadas e em algum lugar me deparei com essa notação:

+function(){console.log("Something.")}()

Alguém pode me explicar o que +significa / faz o sinal na frente da função?

jOpacic
fonte
17
Ben Alman explica tudo aqui: mths.be/iife
Mathias Bynens

Respostas:

1321

Força o analisador a tratar a parte que segue +como expressão. Isso geralmente é usado para funções que são chamadas imediatamente, por exemplo:

+function() { console.log("Foo!"); }();

Sem o +lá, se o analisador estiver em um estado em que espera uma instrução (que pode ser uma expressão ou várias instruções de não expressão), a palavra functionparecerá o início de uma declaração de função em vez de uma expressão de função e, portanto, a ()seguinte (os que estão no final da linha acima) seriam um erro de sintaxe (assim como a ausência de um nome, nesse exemplo). Com o+ , torna-o uma expressão de função, o que significa que o nome é opcional e resulta em uma referência à função, que pode ser chamada, para que os parênteses sejam válidos.

+é apenas uma das opções. Ele também pode ser -, !, ~, ou apenas sobre qualquer outro operador unário. Como alternativa, você pode usar parênteses (isso é mais comum, mas nem mais nem menos correto, sintaticamente):

(function() { console.log("Foo!"); })();
// or
(function() { console.log("Foo!"); }());
TJ Crowder
fonte
12
Mais de elaboração está aqui, benalman.com/news/2010/11/...
Kundan Singh Chouhan
159
Não podemos dizer que o empacotamento de parênteses é uma notação superior? Estou muito familiarizado com parens que servem para abranger expressões. Não está claro o que o + está fazendo neste caso, se você ainda não conhece esse truque arcano de js.
Chris
1
Nota: Das duas opções de parens, o jsLint prefere a segunda. Eu acho que o jsHint é menos exigente.
Beterraba-Beterraba
43
Uma das bibliotecas comumente usadas que usa a notação "plus" é o Bootstrap (que foi como eu acabei de ler este tópico).
Ville
Bootstrap está fazendo isso, btw: maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.js
xanderiel
95

Subsidiária da resposta do @ TJCrowder, +geralmente é usada para forçar a conversão numérica de um valor, conforme explica essa resposta do SO . Nesse caso, ele é chamado de "operador unário +" (para facilitar a busca no Google).

var num = +variant;

Portanto, na frente de uma função, pode ser uma maneira de forçar o resultado da função a ser interpretado como um número. Duvido que isso aconteça ainda, mas teoricamente o JIT poderia usar isso para compilar a função como uma função apenas numérica etc. No entanto, para impedir que o unário mais seja uma concatenação quando usado em uma expressão maior, você precisará de parênteses:

blah + (+(function(){ var scope; return "4"; })());
Phil H
fonte
3
Como isso conseguiu 37 votos positivos? A (+function() { ... })()notação nunca pode ser executada sem erros (além do fato de que isso não responde à pergunta).
whitequark
6
@whitequark: Perdeu um par de chaves ao redor da função + chamada. Suspeito que os votos positivos foram mais por causa da explicação do elenco de números.
Phil H
10
OK, eu poderia ter sido nitpicking.
whitequark
2
@Christoph, eu estaria inclinado a deixar esses suportes lá. Na verdade, eu chegaria ao ponto de adicioná-los se eles estivessem ausentes. Isso torna muito mais claro o que está acontecendo e também evita problemas quando o código é minimizado, removendo os espaços, levando a 3++function...que não seja o mesmo.
Benjam
3
Embora em uma reflexão mais aprofundada, o +function...por si só é desnecessário. O mesmo resultado pode ser obtido com o blah + function( ){ ... }( );que negaria a necessidade dos suportes de embalagem.
Benjam
61

Portanto, a resposta curta é que ela evita um erro de sintaxe, usando os resultados da função de uma maneira ou de outra.

Você também pode instruir o mecanismo de que nem sequer está interessado no valor de retorno usando o voidoperador:

void function() { console.log("Foo!"); }();

Obviamente, colocar aparelhos em volta da coisa toda também serve a esse propósito.

Ja͢ck
fonte
45
Vazios ou parênteses são imensamente preferíveis. Eles são livres de WTF. Usar + é o tipo de inteligência que não é muito inteligente.
quer
2
Um bom argumento. Parece que o uso de um dos operadores passaria contra o que atualmente é o padrão da indústria. Talvez desenvolvedores "miúdo fresco" iria optar por ele, caso contrário, eu ainda não estou vendo um ponto de usar algo em vez de nula ou ()
dudewad