problemas de acessibilidade e organização de código em javascript com jquery

StackOverflow https://stackoverflow.com/questions/1231524

Pergunta

Estou tendo problemas com a ordem do meu código em meu programa. agora eu tenho algumas coisas com em document.ready(function() { } ); e algumas coisas fora do lado dela. Sempre que eu mover qualquer coisa (para organizar ou melhorar o meu código) eu acabar quebrando alguma coisa, eu estou supondo que por causa de qualquer ordem de declarações ou níveis de acesso (ie. Algo fora de document.ready(function {}); não pode acessar dentro de algo dela.

Alguém tem alguma introspecção a respeito de onde as coisas devem estar localizados javascript sábio?

deve tudo estar dentro document.ready(function() {});
Existe alguma razão para ter qualquer coisa fora de document.ready(function() {});? O que É o código dentro inacessível document.ready(function() {}); por código exterior?

Foi útil?

Solução

1. Tudo deve estar dentro document.ready (function () {});?

Não, eu acho que a função document.ready deve ser apenas para inicializar coisas, manipuladores de eventos atribuir e assim por diante.

2. Existe alguma razão para ter qualquer coisa fora de document.ready (function () {});?

Código reutilização, e melhor organização de código.

3. É o código dentro document.ready (função () {}); inacessíveis por código externo?

Sim, as variáveis ??e objetos criados no document.ready são inacessíveis a partir do escopo externo.

Outras dicas

deve tudo estar dentro document.ready (function () {});?

Sim e não. Em aplicações em grande escala JavaScript, eu inicializar meus principais controladores para o escopo global deste manipulador de eventos. No entanto, existe código que não precisa esperar para o DOM para estar pronto, especificamente: código que não contam com o DOM . Eu acho que é bastante simples. Por exemplo, eu declaro configuração objetos classes, funções, etc fora deste manipulador de eventos.

Existe alguma razão para ter qualquer coisa fora de document.ready (function () {});?

Claro, a razão é tocado em acima. Principalmente, código que não requer interação do DOM não deve esperar que o DOM de carga, especialmente se ele pode executar de forma assíncrona para o carregamento DOM (por exemplo .: definições de funções, objetos de configuração, etc).

Além disso, não incluindo todo o seu código em um manipulador de eventos mantém as coisas mais organizadas, permite modularizar código, usar padrões de projeto adequadas, etc.

é o código dentro document.ready (function () {}); inacessíveis por código externo?

Mais uma vez, sim e não. Se você declará-lo como local com var então é sim, ele está inacessível para o escopo externo como ele é local para o manipulador de eventos; caso contrário, é no escopo global e é acessível ao escopo externo. Aqui está um exemplo (hospedado aqui: http://jsbin.com/uriqe )

JavaScript 

var foo = function() {
  alert(global);
  return false;
}

$(document).ready(function() {
  global = "you can see me!?";
  alert("global is initiated");
});

HTML 

<body>
  <p><a href="#" onclick="foo()">click me</a></p>
</body>

onclick ao invés de apego evento método discreto em $(document).ready() é usado intencionalmente para evitar quaisquer dúvidas / discussões sobre foo ter acesso a global via a propriedade de encerramento.

Editar: Eu pensei que eu deixei claro na frase anterior, mas onclick é usado intencionalmente para confusão evitar entre o escopo global e a propriedade de encerramento, mas Eu não sou defendendo o uso de onlick . é claro que é uma prática ruim e você não deve usá-lo.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top