Semplicistico. Quindi aspetto molto normale, è quasi confortante:
var userName = "Sean";
console.log(name());
function name() {
return userName;
}
Tuttavia, cosa succede se includo una libreria JavaScript davvero utile nella mia pagina che traduce i caratteri avanzati nelle loro rappresentazioni di livello base?
Aspetta cosa?
Voglio dire, se qualcuno digita un personaggio con una sorta di accento, ma voglio solo caratteri "inglesi" AZ nel mio programma? Bene ... i caratteri "é" spagnoli e "é" francesi possono essere tradotti in caratteri base di "n" ed "e".
Quindi una persona gentile ha scritto un convertitore di caratteri completo che posso includere nel mio sito ... Lo includo.
Un problema: ha una funzione chiamata 'nome' come la mia funzione.
Questo è ciò che si chiama collisione. Abbiamo due funzioni dichiarate nello stesso ambito con lo stesso nome. Vogliamo evitare questo.
Quindi dobbiamo in qualche modo estendere il nostro codice.
L'unico modo per ottenere il codice scope in javascript è racchiuderlo in una funzione:
function main() {
// We are now in our own sound-proofed room and the
// character-converter libarary's name() function can exist at the
// same time as ours.
var userName = "Sean";
console.log(name());
function name() {
return userName;
}
}
Questo potrebbe risolvere il nostro problema. Ora tutto è racchiuso e vi si può accedere solo dalle nostre parentesi graffe di apertura e chiusura.
Abbiamo una funzione in una funzione ... che è strana da guardare, ma totalmente legale.
Un solo problema. Il nostro codice non funziona. La nostra variabile userName non viene mai ripetuta nella console!
Possiamo risolvere questo problema aggiungendo una chiamata alla nostra funzione dopo il nostro blocco di codice esistente ...
function main() {
// We are now in our own sound-proofed room and the
// character-converter libarary's name() function can exist at the
// same time as ours.
var userName = "Sean";
console.log(name());
function name() {
return userName;
}
}
main();
O prima!
main();
function main() {
// We are now in our own sound-proofed room and the
// character-converter libarary's name() function can exist at the
// same time as ours.
var userName = "Sean";
console.log(name());
function name() {
return userName;
}
}
Una preoccupazione secondaria: quali sono le possibilità che il nome 'main' non sia ancora stato usato? ... molto, molto magro.
Abbiamo bisogno di PIÙ scoping. E un modo per eseguire automaticamente la nostra funzione main ().
Ora arriviamo alle funzioni di auto-esecuzione (o auto-esecuzione, auto-corsa, qualunque cosa).
((){})();
La sintassi è imbarazzante come peccato. Tuttavia funziona.
Quando si racchiude una definizione di funzione tra parentesi e si include un elenco di parametri (un altro set o parentesi!) Si comporta come una chiamata di funzione .
Vediamo quindi di nuovo il nostro codice, con qualche sintassi auto-eseguita:
(function main() {
var userName = "Sean";
console.log(name());
function name() {
return userName;
}
}
)();
Quindi, nella maggior parte dei tutorial che leggi, ora sarai bombardato dal termine "auto-esecuzione anonima" o qualcosa di simile.
Dopo molti anni di sviluppo professionale, ti consiglio vivamente di nominare ogni funzione che scrivi per scopi di debug.
Quando qualcosa va storto (e lo farà), controllerai la backtrace nel tuo browser. È sempre più semplice restringere i problemi del codice quando le voci nella traccia dello stack hanno nomi!
Molto prolisso e spero che sia d'aiuto!