Gli ultimi tutorial di sviluppo web
 

JavaScript Closures


Variabili JavaScript possono appartenere al campo di applicazione locale o globale.

Le variabili private può essere reso possibile con chiusure.


Variabili globali

Una funzione può accedere a tutte le variabili definite all'interno della funzione, come questo:

Esempio

function myFunction() {
    var a = 4;
    return a * a;
}
Prova tu stesso "

Ma una funzione può anche accedere alle variabili definite all'esterno della funzione, come questo:

Esempio

var a = 4;
function myFunction() {
    return a * a;
}
Prova tu stesso "

Nell'ultimo esempio, a è una variabile globale.

In una pagina Web, le variabili globali appartengono all'oggetto finestra.

Le variabili globali possono essere utilizzati (e modificati) da parte di tutti gli script nella pagina (e nella finestra).

Nel primo esempio, a è una variabile locale.

Una variabile locale può essere utilizzata solo all'interno della funzione in cui è definito. Si è nascosta da altre funzioni e altro codice di scripting.

Le variabili globali e locali con lo stesso nome sono diverse variabili. Modificando uno, non modifica l'altro.

Le variabili create senza la parola chiave var, sono sempre globali, anche se vengono creati all'interno di una funzione.


durata variabile

Le variabili globali vivono più a lungo l'applicazione (la finestra / pagina Web) vive.

Le variabili locali hanno vita breve. Essi vengono creati quando viene richiamata la funzione, e eliminati quando la funzione è terminata.


Un dilemma Contatore

Si supponga di voler utilizzare una variabile per il conteggio qualcosa, e si desidera che questo contatore sia disponibile per tutte le funzioni.

Si potrebbe utilizzare una variabile globale, e una funzione per aumentare il contatore:

Esempio

var counter = 0;

function add() {
    counter += 1;
}

add();
add();
add();

// the counter is now equal to 3
Prova tu stesso "

Il contatore deve essere modificato solo dal add() la funzione.

Il problema è, che ogni script nella pagina può cambiare il contatore, senza chiamare add() .

Se io dichiaro il contatore all'interno della funzione, nessuno sarà in grado di cambiarlo senza chiamare aggiungere ():

Esempio

function add() {
    var counter = 0;
    counter += 1;
}

add();
add();
add();

// the counter should now be 3, but it does not work !
Prova tu stesso "

Non ha funzionato! Ogni volta che io chiamo il add() la funzione, il contatore è impostato su 1.

Una funzione interna JavaScript può risolvere questo problema.


Funzioni JavaScript nidificati

Tutte le funzioni hanno accesso alla portata globale.

Infatti, in JavaScript, tutte le funzioni hanno accesso al campo di applicazione "sopra" loro.

JavaScript supporta le funzioni annidate. funzioni nidificate hanno accesso al campo di applicazione "al di sopra" di loro.

In questo esempio, la funzione interna plus() ha accesso alla variabile contatore nella funzione principale:

Esempio

function add() {
    var counter = 0;
    function plus() {counter += 1;}
    plus();   
    return counter;
}
Prova tu stesso "

Questo potrebbe essere risolto il dilemma bancone, se si potesse raggiungere il plus() la funzione dall'esterno.

Abbiamo anche bisogno di trovare un modo per eseguire contatore = 0 solo una volta.

Abbiamo bisogno di una chiusura.


Chiusure JavaScript

Ricordate che le funzioni di auto-invocazione? Che cosa fa questa funzione fare?

Esempio

var add = (function () {
    var counter = 0;
    return function () {return counter += 1;}
})();

add();
add();
add();

// the counter is now 3
Prova tu stesso "

esempio spiegato

La variabile aggiuntivo viene assegnato il valore di ritorno di una funzione di auto-invocazione.

La funzione di auto-invocazione viene eseguito solo una volta. Si imposta il contatore a zero (0), e restituisce un'espressione di funzione.

In questo modo metti diventa una funzione. La parte "meraviglioso" è che si può accedere al contatore nel campo di applicazione genitore.

Questo si chiama una chiusura JavaScript. Essa rende possibile per una funzione di avere variabili "privati".

Il contatore è protetta dal campo di applicazione della funzione anonima, e può essere modificata solo tramite la funzione add.

Una chiusura è una funzione avente accesso alla portata principale, anche dopo la funzione principale è chiuso.