Les variables et les constantes en JavaScript

Les variables sont dynamiques en JavaScript, ce sont des noms associés à des valeurs et que l'on peut réaffecter dans le programme à des valeurs de type différent: nombre, chaîne de caractères, tableau, etc.

Le nom d'une variable est une suite de lettres ou de chiffres, qui commence par une lettre ou le symbole de soulignement, ou le symbole $.
Par exemple:

_x 
nom
nom2
$nom

Le symbol $ seul représente le nom d'une variable. Il est par exemple utilisé par jQuery comme nom de l'objet jQquery.
Exemple de variable de nom $:

$ = "texte";
alert($);

Les noms sont sensibles à la casse, le nom Xeon est différent de xeon.

Déclaration avec le mot réservé var, let ou const

Une variable se déclare par utilisation du mot réservé var:

var x;

Ou par le mot-clé let:

let x;

Dans ces deux cas il faudra qu'elle soit assignée avant que l'on ne l'utilise.
Elle se déclare aussi simplement en assignant une valeur à un nom:

x = 24;

Cela peut amener à quelques confusions...
Une déclaration plus sûre serait plutôt:

var x = 24;
let y = "hello";

A l'intérieur du corps d'une fonction, le mot-clé var ou let est obligatoire pour créer une variable locale à cette fonction. Il ne l'est pas dans l'espace global ni pour les arguments des fonctions.
Si la variable n'a pas de valeur assignée, son contenu est undefined, ce que l'on peut tester par une instruction de comparaison:

var y;
if(y == undefined) {
    y = 0;       
}

Les constantes se déclarent avec le mot réservé const (à la place de var) et sont assignées lors de la déclaration, puis il est par définition impossible de les modifier ultérieurement.

const x = 24;

Différence entre var et let

Une variable déclarée par le mot-clé var est visible dans le scope ou elle est définie et dans les scopes intérieurs.

function outer() {
  var a1 = "hello";
  if(true) {
    var a1 = "hello le monde";
    display("a1 dans if: " + a1);
   }
  display("a1 hors de if: " + a1);
}
outer();

Utilisation de var

Reprenons le même script et utilisons let au lieu de var...

function outer() {
  let a1 = "hello";
  if(true) {
    let a1 = "hello le monde";
    display("a1 dans if: " + a1);
  }
  display("a1 hors de if: " + a1);
}
outer();

Utilisation de let

Nous voyons qu'avec let, la visibilité de la variable est limitée au scope de la structure de contrôle où elle est déclarée.

Il est préférable de déclarer une variable avec let pour éviter toute confusion, à moins que l'on n'ait besoin spécifiquement d'une visibilité globale.

En résumé...

Déclaration var :

Une déclaration var est visible dans le scope courant et dans les scopes intérieurs, même si on rédéclare la variable dans ceux-ci.
Une déclaration var dans une fonction n'est pas visible hors de cette fonction.
Une déclaration var dans une structure de contrôle est visible hors de celle-ci. Si la structure est dans une fonction, elle est visible dans la fonction mais pas hors de celle-ci.
Déclarer une variable n'importe ou dans un script équivaut à la déclarer en début du script (hissage, ou hoisting en anglais). Cela ne concerne pas les autres scripts dans la page. On peut très bien assigner puis ensuite référencer une var avant la déclaration.

Déclaration let :

Une déclaration let est visible dans la fonction ou le bloc ou elle est déclarée et non hors de ceux-ci.
Les variables déclarées par let sont visibles dans les blocs intérieurs. On ne peut pas les redéclarer avec let dans un bloc intérieur. (Ce serait une double déclaration).
Vous ne pouvez pas écrire: if(x) let y = 1;
Parce que y ne serait utilisable nulle part. Vous pouvez écrire if(x) y = 1;

Déclaration const :

const se comporte comme let.

Trois primitives et des objets

Les primitives du langage sont:

boolean
string
number

Ce sont des mots réservés et d'autres mots-clés ont été réservés pour l'avenir: byte, float, int, short, etc...

Pour connaître le type d'un variable, qui est définie par la valeur qui lui est assignée, on utilise typeof. Exemple:

document.write(typeof Boolean(true));
let x = "text";
document.write(typeof x);

Il existe des objets prédéfinis de même nom que ces primitives, mais capitalisés:

Boolean
Number
String

Ils sont initialisé par un argument. Exemple:

let x = new Number(50);
let y = new String("texte");

Si l'on associe une propriété de l'objet correspondant à une primitive,, par exemple length à une chaîne, celle-ci sera transformée dynamiquement en objet pour cette instruction. Cela ne change pas le type de la variable au-delà de l'instruction.

Démonstration:

let a = "texte";
document.write(typeof a); 
document.write(a.length);
a = new String("demo");
document.write(typeof a);

La visibilité est locale à une fonction ou globale

Une variable est considérée comme globale si elle est déclarée hors d'une définition de fonction ou d'une structure. Elle est alors visible dans le corps des fonctions et dans toutes structures de l'espace global ou contenues dans des fonctions.

Une variable définie dans une fonction est visible dans cette fonction et dans le corps de toute structure contenue dans cette fonction.

Mais si elle est créée sans le mot clé var, elle fait alors partie de l'espace global, mais si elle n'a pas été définie hors de la fonction.

function() {
  let x = 1;
  y = 2;
}

La variable x est locale tandis que y est globale.

Une variable définie globalement dans une fenêtre HTML, peut être utilisée dans une autre si on l'associe au nom de la fenêtre, par exemple, x est définie dans une fenêtre avec le nom win2:

win2.x;

Des valeurs sont prédéfinies pour les tests conditionnels

Certaines valeurs font partie du langage:

true: vrai, une valeur booléenne.
false: faux, la valeur booléenne opposée.
undefined: Comme on l'a vu, variable non assignée.
NaN: Not A Number. Valeur indiquant que la variable ne contient pas un nombre. On peut assigner cette valeur, x = NaN, et la tester avec la fonction isNaN().
null: N'a aucune valeur assignée.

Voir aussi

Les règles de visibilité. Ces règles sont uniques à JavaScript.
Objet. Les objets sont des variables dynamiques auxquelles on ajoute des attributs et des méthodes.