Como essa sintaxe JavaScript / jQuery funciona: (função (janela, indefinida) {}) (janela)?

Você já deu uma olhada no código fonte do jQuery 1.4 e percebeu como ele é encapsulado da seguinte maneira:

(function( window, undefined ) {

  //All the JQuery code here 
  ...

})(window);

Eu li um artigo sobre JavaScript Namespacing e outro chamado " An Important Pair of Parens ", para saber um pouco do que está acontecendo aqui.

Mas nunca vi essa sintaxe específica antes. O que isso está undefinedfazendo aí? E por que windowprecisa ser aprovado e depois aparecer no final novamente?

O indefinido é uma variável normal e pode ser alterado simplesmente com undefined = "new value";. Portanto, o jQuery cria uma variável local "indefinida" que é REALMENTE indefinida.

A variável window é feita local por razões de desempenho. Porque quando o JavaScript procura uma variável, ele primeiro percorre as variáveis ​​locais até encontrar o nome da variável. Quando não é encontrado, o JavaScript passa pelo próximo escopo etc. até filtrar pelas variáveis ​​globais. Portanto, se a variável da janela for tornada local, o JavaScript poderá procurar mais rapidamente. Mais informações: Acelere seu JavaScript - Nicholas C. Zakas

Indefinido

Declarar undefinedcomo argumento, mas nunca passar um valor para ele garante que ele seja sempre indefinido, pois é simplesmente uma variável no escopo global que pode ser substituída. Isso faz a === undefineduma alternativa segura para typeof a == 'undefined', o que salva alguns caracteres. Também torna o código mais amigável ao minifier, como undefinedpode ser reduzido para, upor exemplo, salvando mais alguns caracteres.

Janela

Passar windowcomo argumento mantém uma cópia no escopo local, o que afeta o desempenho: http://jsperf.com/short-scope . Todos os acessos windowagora precisam percorrer um nível a menos na cadeia de escopo. Assim como acontece undefined, uma cópia local novamente permite minificação mais agressiva.

Nota:

Embora isso possa não ter sido a intenção dos desenvolvedores do jQuery, a transferência windowpermite que a biblioteca seja mais facilmente integrada nos ambientes Javascript do servidor, por exemplo, node.js - onde não há windowobjeto global . Em tal situação, apenas uma linha precisa ser alterada para substituir o windowobjeto por outra. No caso do jQuery, um windowobjeto simulado pode ser criado e transmitido para fins de raspagem de HTML (uma biblioteca como o jsdom pode fazer isso).

Outros já explicaram undefined. undefinedé como uma variável global que pode ser redefinida para qualquer valor. Essa técnica é para impedir que todas as verificações indefinidas sejam quebradas se alguém escreveu digamos, em undefined = 10algum lugar. Um argumento que nunca é passado é garantido como real, undefinedindependentemente do valor da variável undefined .

A razão para passar pela janela pode ser ilustrada com o exemplo a seguir.

(function() {
   console.log(window);
   ...
   ...
   ...
   var window = 10;
})();

O que o console registra? O valor do windowobjeto certo? Errado! 10? Errado! Ele registra undefined. O interpretador Javascript (ou compilador JIT) o reescreve desta maneira -

(function() {
   var window; //and every other var in this function

   console.log(window);
   ...
   ...
   ...
   window = 10;

})();

No entanto, se você receber a windowvariável como argumento, não haverá var e, portanto, nenhuma surpresa.

Eu não sei se o jQuery está fazendo isso, mas se você estiver redefinindo windowa variável local em qualquer lugar da sua função por qualquer motivo, é uma boa ideia emprestá-la do escopo global.

windowé passado dessa maneira, apenas no caso de alguém decidir redefinir o objeto de janela no IE, presumo o mesmo undefined, caso seja reatribuído de alguma forma posteriormente.

A parte superior windowdesse script está apenas nomeando o argumento "janela", um argumento mais local que a windowreferência global e qual o código dentro deste fechamento usará. O windowfinal está realmente especificando o que passar para o primeiro argumento, neste caso, o significado atual de window... a esperança é que você não tenha estragado tudo windowantes que isso aconteça.

Isso pode ser mais fácil de pensar, mostrando o caso mais comum usado no jQuery, .noConflict()manipulação de plug-ins , portanto, para a maioria do código você ainda pode usar $, mesmo que isso signifique algo diferente de jQueryfora deste escopo:

(function($) {
  //inside here, $ == jQuery, it was passed as the first argument
})(jQuery);

Testado com 1000000 iterações. Esse tipo de localização não teve efeito no desempenho. Nem um único milissegundo em 1000000 iterações. Isso é simplesmente inútil.