« retourner à la page principale du blog

Portée des variables en JavaScript

Publié le 28 octobre 2008 dans JavaScript

Les variables en JavaScript, comme dans la plupart des langages de programmation, ont une portée (variable scope). De la manière que ça fonctionne en JavaScript, elles sont soit globales ou locales.

Variables globales

Les variables globales sont accessibles et modifiables de partout dans le code. On n’a pas à les passer en paramètre pour les lire ou modifier à l’intérieur de fonctions. Pour déclarer des variables globales, on n’a qu’à la déclarer avec var en dehors d’une fonction. Sinon, on peut aussi la déclarer sans var à l’intérieur d’une fonction. Sans vouloir trop pousser, je crois que la recommandation est de toujours déclarer les variables avec var. Il faudrait donc s’assurer de déclarer la variable en dehors de toute fonction avant de l’utiliser de manière globale dans une fonction.

Variables locales

Les variables locales sont accessibles et modifiables uniquement à l’intérieur de la fonction dans laquelle elles sont déclarées. Pour les déclarer, il suffit de le faire avec var à l’intérieur de la fonction. Elles seront automatiquement détruite à la fin de l’exécution de la fonction. Ce type de variable est utile pour les algorithmes propres à la fonction. Ça évite d’exposer le fonctionnement interne d’une fonction au reste du monde afin d’aider à la modularité du code. Aussi, les variables locales évite une surpopulation de variables qui pourraient entrainer des collisions de nom de variable.

Variables statiques

Les programmeurs familiers avec d’autres langages pourraient s’attendre aux variables statiques. Ces variables sont comme les variables locales, i.e. disponibles uniquement à l’intérieur de la fonction, mais leur valeur ne se perd pas entre chaque appel de la fonction. Ce type de portée n’existe pas en JavaScript.

Exemple

var aaa = 8;    // variable globale

alert("aaa: " + aaa);    // affiche "aaa: 8"

fonctionUn();    // affiche "aaa: 11" et "bbb: 10"

alert("aaa: " + aaa);    // affiche "aaa: 11"

alert("bbb: " + bbb);    // erreur, b n'existe pas ici

fonctionDeux();    // affiche "aaa: 12"

alert("aaa: " + aaa);    // affiche "aaa: 11"

function fonctionUn(){
  aaa = 11;
  alert("aaa: " + aaa);    // aaa est globale
  var bbb = 10;    // variable locale
  alert("bbb: " + bbb);
}

function fonctionDeux(){
  var aaa = 12;    // variable locale
    // la version local sera utilisée
    // la version globale reste intouchée
  alert("aaa: " + aaa);
}

Résumé

En bref, lorsqu’une variable ne sert qu’au fonctionnement interne d’une fonction, on devrait la déclarer avec var à l’intérieur de la fonction afin qu’elle soit détruite à la fin de la fonction. Si la variable est créée lors de l’appel de la fonction, et sera encore utile par la suite, on devrait la retourner avec return. Si elle est nécessaire tout au long du script, on devrait la déclarer avec var en dehors des fonctions, au début du script ou à un autre endroit approprié.

Un commentaire

  1. Encore un mot sur les variables en JavaScript - Hooba Studios dit :
    9 novembre 2008 à 14:13

    [...] un précédent article, je parlais de la portée des variables en JavaScript. Je veux revenir sur les variables globales pour ajouter quelques [...]

Laisser un commentaire

« retourner à la page principale du blog