Cominciamo con un esempio e poi analizziamo come funziona quel codice dietro le quinte.

var x = 10;
var y = 20;

function add(a,b){
  return a+b;
}

var result = add(x,y);

console.log(result) //30

Innanzitutto, dichiara le variabili x e y e inizializza con i rispettivi valori 10 e 20.

In secondo luogo, dichiara la funzione add che accetta l'argomento e restituisce la somma degli argomenti, ad esempio 10 + 20 = 30.

Terzo, chiama la funzione add con gli argomenti come i valori della variabile x & y e memorizza il risultato nella variabile result.

Infine, output della variabile result con console.

Durante l'esecuzione del codice sopra JavaScript fa molte cose.

Quando il motore JavaScript esegue il codice JavaScript in quel momento, crea contesti di esecuzione.

Ogni contesto di esecuzione ha due fasi

1. La fase di creazione.
2. La fase esecutiva.

Quando il motore JavaScript esegue il codice per la prima volta, crea il contesto di esecuzione globale. Durante questa fase JavaScript esegue alcune attività.

1. Crea l'oggetto globale, ad esempio la finestra nel browser Web o globale in Node.js .
2. Crea questo oggetto (questa parola chiave) e associalo all'oggetto globale, in caso di browser web questa parola chiave è allegata con l'oggetto finestra e in Node js questa parola chiave è allegata con l'oggetto globale.
3. Impostare un heap di memoria per memorizzare riferimenti a variabili e funzioni.
4. Memorizza le dichiarazioni di funzione nell'heap della memoria e le variabili all'interno del contesto di esecuzione globale con i valori iniziali non definiti.

1. Memorizza la variabile x, y & result e la dichiarazione di funzione add() nel contesto di esecuzione globale.
2. Inizializza le variabili con valore non definito, ad esempio x = non definito, y = non definito e risultato = non definito.

Fase di esecuzione

Durante la fase di esecuzione, il motore JavaScript esegue il codice riga per riga, assegna i valori alle variabili ed esegue le chiamate alle funzioni.

Per ogni chiamata di funzione, il motore JavaScript crea una nuova chiamata di esecuzione funzionale.

Il contesto di esecuzione della funzione è simile al contesto di esecuzione globale. Ma invece di creare l'oggetto globale, il motore JavaScript crea l'oggetto arguments che è un riferimento a tutti i parametri della funzione.

Nel nostro esempio, il motore JavaScript crea un oggetto arguments che fa riferimento a tutti i parametri passati alla funzione e imposta questo valore sull'oggetto globale in caso di browser web questo valore è collegato con l'oggetto window e in Node js questo valore è collegato con global oggetto e inizializza anche un parametro & b con valore indefinito.

Durante la fase di esecuzione del contesto di esecuzione della funzione, il motore JavaScript assegna il valore 10 & 20 al parametro a & b e restituisce il risultato (30) al contesto di esecuzione globale.

Per tenere traccia di tutti i contesti di esecuzione, inclusi il contesto di esecuzione globale e i contesti di esecuzione della funzione, il motore JavaScript utilizza lo stack di chiamate.

Restiamo in contatto

Spero che questo articolo ti sia utile, ci vediamo al prossimo!