Variables globales dans les fonctions en JavaScript

En JavaScript (dans d'autres langages, le plus souvent ce n'est pas le cas) les variables, définies à l'extérieur d'une fonction, seront visibles à l'intérieur de cette fonction. De telles variables sont appelées globales. Regardons un exemple :

javascriptlet num = 1; // variable à l'extérieur de la fonction

function func() {
  console.log(num); // la variable num est visible à l'intérieur de la fonction
}

func(); // affichera 1

En fait, la variable doit être définie non pas avant la définition de la fonction, mais avant son appel :

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

let num = 1; // variable à l'extérieur de la fonction
func();      // affichera 1

Si vous changez la valeur de la variable et qu'après cela vous appelez la fonction à chaque fois - console.log affichera des résultats différents à chaque fois :

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

let num; // déclarons la variable

num = 1; // définissons la valeur à 1
func();  // affichera 1

num = 2; // définissons la valeur à 2
func();  // affichera 2

Si nous avons plusieurs fonctions, alors la variable globale sera accessible dans chacune de ces fonctions :

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

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

let num = 1;

func1(); // affichera 1
func2(); // affichera 1

Si des modifications surviennent dans l'une des fonctions avec la variable globale, alors cette variable changera dans toutes les fonctions utilisant cette variable :

javascriptfunction func1() {
  console.log(num);
  num++; // modifions la variable globale
}

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

let num = 1;

func1(); // affichera 1
func2(); // affichera 2

Puisque n'importe laquelle des fonctions peut facilement changer la variable globale, leur utilisation représente un nid d'erreurs difficiles à détecter. Pour cette raison, l'utilisation de variables globales dans un script doit être réduite au minimum. Idéalement, il ne devrait y en avoir aucune ou un nombre très limité.

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();