Cosa sono le chiusure in JavaScript e come funzionano?

è un linguaggio orientato alle funzioni che offre molta libertà all'utente. È possibile creare una funzione dinamicamente, copiarla in un'altra variabile o passare come argomento a un'altra funzione e chiamare da un punto diverso in un secondo momento. Le chiusure in JavaScript vengono create ogni volta che viene creata una funzione, al momento della creazione della funzione. In questo articolo, capiremo le chiusure nella seguente sequenza:

• Introduzione alle chiusure in JavaScript
• Chiusure pratiche
• Catena di portata
• Chiusura in un ciclo

Introduzione alle chiusure in JavaScript

Una chiusura è una combinazione di un file funzione raggruppato insieme a riferimenti al suo stato circostante, ovvero l'ambiente lessicale. In altre parole, una chiusura fornisce l'accesso da una funzione interna all'ambito di una funzione esterna.

copia profonda java vs copia superficiale

La maggior parte degli sviluppatori utilizza le chiusure in JavaScript consapevolmente o inconsciamente. Fornisce un migliore controllo sul codice durante l'utilizzo. Inoltre, è la domanda più frequente durante qualsiasi .

Esempio:

funzione foo () {var x = 10 function inner () {return x} return inner} var get_func_inner = foo () console.log (get_func_inner ()) console.log (get_func_inner ()) console.log (get_func_inner ())

Produzione:

10
10
10

Qui puoi accedere al file variabile x che è definita nella funzione foo () attraverso la funzione inner () poiché la successiva conserva la catena di ambito della funzione di inclusione al momento dell'esecuzione della funzione di inclusione. Pertanto, la funzione interna conosce il valore di x attraverso la sua catena di ambito. Ecco come puoi usare le chiusure in JavaScript.

Chiusure pratiche

Le chiusure consentono di associare l'ambiente lessicale a una funzione che opera su quei dati. Questo ha ovvi paralleli con programmazione orientata agli oggetti , dove gli oggetti ci consentono di associare le proprietà dell'oggetto a uno o più metodi.

Di conseguenza, è possibile utilizzare una chiusura ovunque si utilizzi normalmente un oggetto con un solo metodo.

Esempio:

funzione makeSizer (size) {return function () {document.body.style.fontSize = size + 'px'}} var size12 = makeSizer (12) var size14 = makeSizer (14) var size16 = makeSizer (16)

L'esempio sopra è generalmente allegato come callback: una singola funzione che viene eseguita in risposta all'evento.

Catena di portata

Le chiusure in JavaScript hanno tre ambiti come:

• Ambito locale
• Ambito delle funzioni esterne
• Ambito globale

Un errore comune è non rendersi conto che, nel caso in cui la funzione esterna sia essa stessa una funzione nidificata, l'accesso all'ambito della funzione esterna include l'ambito di chiusura della funzione esterna, creando effettivamente una catena di ambiti di funzione.

// global scope var x = 10 function sum (a) {return function (b) {return function (c) {// funzioni esterne scope return function (d) {// local scope return a + b + c + d + x}}}} console.log (sum (1) (2) (3) (4)) // log 20

Può anche essere scritto senza funzioni anonime:

// global scope var x = 10 function sum (a) {return function sum2 (b) {return function sum3 (c) {// funzioni esterne scope return function sum4 (d) {// local scope return a + b + c + d + x}}}} var s = sum (1) var s1 = s (2) var s2 = s1 (3) var s3 = s2 (4) console.log (s3) // log 20

Nell'esempio precedente, è presente una serie di funzioni annidate che hanno tutte accesso all'ambito esterno di una funzione, quindi si può dire che le chiusure hanno accesso a tutti gli ambiti di funzione esterni all'interno dei quali sono state dichiarate.

Chiusura in un ciclo

Puoi usare le chiusure in JavaScript per memorizzare una funzione anonima in ogni indice di un file Vettore . Facciamo un esempio e vediamo come vengono utilizzate le chiusure all'interno di un ciclo.

Esempio:

cos'è una sottostringa in java

funzione outer () {var arr = [] var i for (i = 0 i<3 i++) { // storing anonymus function arr[i] = function () { return i } } // returning the array. return arr } var get_arr = outer() console.log(get_arr[0]()) console.log(get_arr[1]()) console.log(get_arr[2]())

Produzione:

3
3
3
3

Con questo siamo giunti alla fine del nostro articolo. Spero che tu abbia capito come funzionano le chiusure in JavaScript e come vengono utilizzate per ottenere un migliore controllo del codice.

Ora che conosci le chiusure in JavaScript, controlla il file di Edureka. La formazione sulla certificazione per lo sviluppo web ti aiuterà a imparare come creare siti Web straordinari utilizzando HTML5, CSS3, Twitter Bootstrap 3, jQuery e API di Google e a distribuirli su Amazon Simple Storage Service (S3).

Hai domande per noi? Si prega di menzionarlo nella sezione commenti di 'Chiusure in JavaScript' e ti risponderemo.