A definição de Funções Em Javascript Dentro de jQuery

Question

Eu estou trabalhando em um proprietário de site, e estou tendo alguns problemas.Estou usando o jQuery juntamente com o protótipo, e eu tenho namespace corretamente, então nesta pergunta suponha que você pode usar $ ou jQ como uma referência ao namespace do jQuery.

Então eu tenho um monte de funções, algumas mistura de jQuery e javascript, algumas simples javascript, ajax, apenas.Agora, atualmente, algumas funções são definidas no documento.pronto jQuery função, e alguns são definidas fora dela, tipo, como este:

jQ(document.ready(function($) {

  if ( ifConfig ) {
    //page check, function calls here
    fnc1();
    fnc2();
    fnc3();
    fnc4();
  }

  function fnc1() {
    //fnc code in here
  }
  function fnc2() {
    //fnc code in here
  }
});  //end document.ready

function fnc3() {
}
function fnc4() {
}

Agora tudo isso é pseudo-código, você pode assumir as funções são válidos e ter código válido em si.Recentemente eu estava fazendo alguma depuração, e uma das minhas funções, que foi declarado e chamado de dentro do documento.pronto disse que era indefinido.Mudei-me do lado de fora do documento.pronto, e tudo funcionou novamente.

Eu estou basicamente tentando entender a ordem de como as funções são iniciadas/chamada " melhor, então a minha pergunta é quando você declarar funções dentro do documento.pronta e quando você declará-los fora?Você apenas declarar dentro quando eles são chamados dentro do documento.pronto só?Ou devo sempre apenas declará-los de fora do documento.pronto?

Obrigado.

Answer 1

Geralmente, você deve declarar & definir o seu próprio namespace, onde todos os seus lógica da aplicação (incluindo as funções/métodos) está localizado.De que forma a evitar collision com outros scripts em seu site + que forma o seu código muito mais limpo e mais fácil de maintenaine.

var myapp = function(){
    var foobar1 = null,
        foobar2 = null,
        foobar3 = null;

    return {
        getFoobar1:  function(){
           return foobar1;
        },
        getFoobar2:  function(){
           return foobar2;
        },
        setFoobar1:  function(foo){
           foobar1 = foo;
        },
        clickhandler: function(e){
           alert('I am an event handler, and I am not anonymous');
        }
        // etc.
    };
};

$(document).ready(function(){
    var Application = myapp();

    Application.getFoobar2();

    $(document).bind('click', Application.clickhandler);
});

Que padrão (alguns chamam de "método padrão") cria um closured função/objeto que também garante variáveis de membro privado dentro do espaço de nomes, e somente acessíveis através do getter funções do lado de fora.

Isso é realmente apenas um exemplo muito básico, você pode empurrar essa idéia e padrão de uma medida, o que é muito bom e uma coisa boa (IMO).

Um grande livro sobre isso, que foi nomeado e recomendado muitas vezes é "Javascript:As Partes Boas" por Douglas Crockford.

Answer 2

Se uma função for usada apenas dentro da função pronta para o documento, declare -a dentro para não poluir o escopo global. Caso contrário, declare -o para fora, para que o restante do seu script tenha acesso a essas funções.

Answer 3

(documento).pronto é mais usado para coisas que precisam ser executadas no carregamento da página, e não declarações de função.Se você declará-los dentro de (documento).pronto, o seu âmbito será local para que bloco se elas são usadas apenas localmente, o que é bom e eles devem ser declarados lá.Caso contrário, declarar-los fora.

Assim, em seu exemplo, se as funções são utilizadas apenas em bloco, eles devem ser declarados lá.Se eles são usados em outros lugares além disso, eles devem ser declarados fora.