Problemi di accessibilità e organizzazione del codice in javascript con jquery

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

Domanda

Sto riscontrando problemi con l'ordine del mio codice nel mio programma. in questo momento ho alcune cose con in document.ready (function () {}); e alcune cose al di fuori di esso. Ogni volta che muovo qualcosa (per organizzare o migliorare il mio codice) finisco per rompere qualcosa, suppongo a causa di un ordine di dichiarazioni o di livelli di accesso (cioè qualcosa al di fuori di document.ready (funzione {}); impossibile accedere a qualcosa al suo interno.

Qualcuno ha qualche idea su dove dovrebbero essere posizionate le cose javascript saggio?

Dovrebbe essere tutto all'interno di document.ready (function () {}); ?
C'è qualche motivo per avere qualcosa al di fuori di document.ready (function () {} ); ?
Il codice all'interno di document.ready (function () {}); è inaccessibile dal codice esterno?

È stato utile?

Soluzione

  

1. Dovrebbe essere tutto dentro   document.ready (function () {}) ;?

No, penso che la funzione document.ready debba essere solo per inizializzare le cose, assegnare gestori di eventi e così via.

  

2. C'è qualche motivo per avere   qualsiasi cosa al di fuori di   document.ready (function () {}) ;?

Riutilizzo di codice e migliore organizzazione del codice.

  

3. Il codice è dentro   document.ready (function () {});   inaccessibile dal codice esterno?

Sì, le variabili e gli oggetti creati nel documento sono già inaccessibili dall'ambito esterno.

Altri suggerimenti

Dovrebbe essere tutto all'interno di document.ready (function () {}) ;?

Sì e no. Nelle applicazioni JavaScript su larga scala, inizializzo i miei controller principali nell'ambito globale da questo gestore di eventi. Tuttavia, esiste un codice che non deve attendere che il DOM sia pronto, in particolare: codice che non si basa sul DOM . Penso che sia piuttosto semplice. Ad esempio, dichiaro classi, funzioni, ecc. Degli oggetti di configurazione al di fuori di questo gestore di eventi.

C'è qualche motivo per avere qualcosa al di fuori di document.ready (function () {}) ;?

Certo, per il motivo è toccato sopra. Principalmente, il codice che non richiede l'interazione DOM non dovrebbe attendere il caricamento del DOM, soprattutto se può essere eseguito in modo asincrono al caricamento del DOM (ad es. Definizioni di funzioni, oggetti di configurazione, ecc.)

Inoltre, non includere tutto il codice in un gestore di eventi mantiene le cose più organizzate, consente di modulare il codice, utilizzare schemi di progettazione adeguati, ecc.

È il codice all'interno di document.ready (function () {}); inaccessibile dal codice esterno?

Ancora una volta, sì e no. Se lo dichiarate locale con var , allora è sì, è inaccessibile dall'ambito esterno in quanto è locale al gestore eventi; in caso contrario, è nell'ambito globale ed è accessibile all'ambito esterno. Ecco un esempio (ospitato qui: 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 anziché l'allegato non discreto dell'evento del metodo in $ (document) .ready () viene utilizzato intenzionalmente per evitare qualsiasi domanda / argomento su foo avere accesso a global tramite la proprietà di chiusura.

Modifica: ho pensato di averlo chiarito nella frase precedente, ma onclick è usato intenzionalmente per evitare confusione tra ambito globale e proprietà di chiusura, ma Non sto sostenendo l'uso di onlick . Naturalmente è una cattiva pratica e non dovresti usarla.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top