Variabili globali nelle funzioni in JavaScript

In JavaScript (nella maggior parte degli altri linguaggi non è così) le variabili definite all'esterno della funzione, saranno visibili all'interno di questa funzione. Tali variabili sono chiamate globali. Vediamo con un esempio:

javascriptlet num = 1; // variabile all'esterno della funzione

function func() {
  console.log(num); // la variabile num è visibile all'interno della funzione
}

func(); // visualizzerà 1

In realtà la variabile deve essere definita non prima della definizione della funzione, ma prima della sua chiamata:

javascriptfunction func() {
  console.log(num);
}

let num = 1; // variabile all'esterno della funzione
func();      // visualizzerà 1

Se si cambia il valore della variabile e dopo ciò si chiama ogni volta la funzione - console.log visualizzerà risultati diversi ogni volta:

javascriptfunction func() {
  console.log(num);
}

let num; // dichiariamo la variabile

num = 1; // impostiamo il valore a 1
func();  // visualizzerà 1

num = 2; // impostiamo il valore a 2
func();  // visualizzerà 2

Se abbiamo diverse funzioni, allora la variabile globale sarà accessibile in ciascuna di queste funzioni:

javascriptfunction func1() {
  console.log(num);
}

function func2() {
  console.log(num);
}

let num = 1;

func1(); // visualizzerà 1
func2(); // visualizzerà 1

Se in una delle funzioni avvengono modifiche alla variabile globale, allora questa variabile cambierà in tutte le funzioni che utilizzano questa variabile:

javascriptfunction func1() {
  console.log(num);
  num++; // modifichiamo la variabile globale
}

function func2() {
  console.log(num);
}

let num = 1;

func1(); // visualizzerà 1
func2(); // visualizzerà 2

Poiché qualsiasi funzione può facilmente cambiare la variabile globale, il loro utilizzo rappresenta un covo di errori difficili da individuare. Per questo motivo, l'uso di variabili globali negli script dovrebbe essere ridotto al minimo. È auspicabile che non ce ne siano affatto o che ce ne sia il numero minimo possibile.

javascriptlet num = 1;
    
function func() {
  console.log(num);
}

func();

javascriptlet num = 1;
    
function func() {
  console.log(num);
}

num = 2;
func();

javascriptfunction func() {
  console.log(num);
}

let num;

num = 1;
func();

num = 2;
func();