Les variables

Une variable est un nom symbolique représentant une valeur de tout type : chaîne, nombre, fonctions entières, éléments du DOM…

var monAge = 22;
var monNom = "Kevin";

monNom; renverra maintenant Kevin tandis que monAge; renverra 22

  • On peut lui donner l’identifiant que l’on veut à condition :
    • d’utiliser le principe du CamelCase
    • de ne jamais utiliser d’accents, d’espace et de ponctuation, excepté un $ ou un _
    • de ne jamais utiliser de chiffre pour commencer l’identifiant de la variable
    • de ne jamais utiliser comme identifiant un mot-clé réservé de JavaScript
  • Il est conseillé de déclarer chaque nouvelle variable avec le mot-clé var
  • Comme pour toute commande JavaScript, il est également conseillé de terminer avec un point-virgule.
  • Une variable se comportera toujours comme les données qu’elle contient : comme un nombre, une chaîne…
  • Une variable est toujours modifiable
    monNom = "Brandon"; va modifier la valeur « Kevin » en « Brandon » dans la variable

Il est possible de vérifier le type de contenu d’une variable avec l’instruction typeof

typeof monNom; renverra string
typeof monAge; renverra number

Il est aussi possible de déclarer une variable vide qui sera remplie plus tard.

var monAdresse;

Il est possible de déclarer plusieurs variables sur une même ligne en utilisant les virgules :
var fleur = "Rose", arbre = "Chêne", animal = "Poulpe";

Rendons cela plus amusant, vous vous souvenez de la commande prompt(); qui demande une réponse de l’utilisateur ? Cette réponse est affichée dans la console mais nous ne pouvons rien en faire… à moins de l’enregistrer dans une variable :

var maVille = prompt("Quelle ville habite notre ami(e) ?");

Ensuite, nous pourrons réutiliser ce que notre visiteur a encodé :

maVille;

A partir de maintenant, la ville encodée par l’utilisateur est utilisable dans notre script. Mais allons un poil plus loin :

var nomDuVisiteur = prompt("Bonjour, comment t'appelles-tu ?");
var ageDuVisiteur = prompt("Bonjour " + nomDuVisiteur + ", quel âge as-tu ?");
var villeDuVisiteur = prompt ("... et où habites-tu ?");
alert("Ravi de te rencontrer " + nomDuVisiteur + ", " + villeDuVisiteur + " est un endroit merveilleux pour une personne de " + ageDuVisiteur + " ans !");

Et ce n’est qu’un premier exemple de ce que nous pourrons faire !

Juste une remarque importante : une commande prompt(); considère toujours la réponse d’un visiteur comme une chaîne ! La preuve :

typeof ageDuVisiteur; va vous répondre string

Vous ne pourrez donc pas l’additionner, à moins de lui expliquer que c’est un nombre :

alert(ageDuVisiteur + 2); va faire une concaténation car il considère l’âge comme une chaîne
alert(Number(ageDuVisiteur) + 2); va faire une addition car on lui précise que c’est un nombre (attention au N majuscule à Number())

Modifier la valeur d’une variable

Lorsque le contenu de la variable est un nombre, il existe des opérateurs qui modifient ce nombre et enregistrent le résultat dans la variable, à la place du nombre d’origine :

var maVariable = 10;

OpérateurDescriptionUsageRésultat
++Ajouter 1 à une variablemaVariable++11
--Soustraire 1 à une variablemaVariable--9
+=Ajouter une valeur à une variablemaVariable += 212
-=Soustraire une valeur à une variablemaVariable -= 37
*=Multiplier une variable par une valeurmaVariable *- 550
/=Diviser une variable par une valeurmaVariable /- 25

La portée d’un variable

Une variable en JavaScript peut avoir une portée globale ou locale. Pour faire court, une variable définie à l’intérieur d’une fonction ne sera pas reconnue en dehors de cette fonction, elle est donc locale. Il y a des possibilités de la rendre globale mais comme nous définissons nos variables en utilisant var, chacun reste chez soi pour le moment. Les locales restent locales et les globales sont accessibles partout.

Il existe 2 autre manières de déclarer une variable :

let maVariable = "Coucou !"

La différence réside dans la portée. var est de portée fonction ou globale, let est de portée bloc. let ne peut pas être redéclarée mais peut être réaffectée à une valeur.

const maVariable = 48

const est un type de variable utilisé pour déclarer une valeur fixe qui ne peut pas être modifiée dans le temps une fois déclarée. const ne peut être ni redéclarée ni réaffectée.