Variables

Comme les autres langages, Javascript offre la possibilité de déclarer et d'utiliser des variables.

Une variable est un espace mémoire pouvant stocker n'importe quelle donnée destinée à être affichée ou à faire l'objet de traitements.

Créer une variable

Pour créer une variable, il vous faut définir un nom respectant les règles suivantes :

il doit être significatif et représentatif de la donnée stockée ;
il doit commencer par une lettre (en minuscule ou en majuscule) ou par le caractère "_" ;
il peut comporter des lettres, des chiffres et les caractères "_" et "&" ;
il ne doit pas correspondre à un nom réservé ; c'est-à-dire un nom déjà utilisé dans Javascript.

Dans les exemples suivants, notre variable aura comme objectif de stocker un nom de ville.

Une fois le nom choisi (nomVille dans notre cas), il suffit de l'écrire dans votre code en le faisant précéder du nom réservé var :

var nomVille;

L'exemple ci-dessus montre la création de la variable nommée "nomVille". Pour le moment, elle n'est pas valorisée. Sa valeur est undefined. Ce nom réservé indique qu'aucune valeur n'a été affectée à cette variable.

La variable ainsi créée pourra être utilisée par mention de son nom dans la suite du script (le nom réservé var ne doit être mentionné que lors de la création).

Valoriser une variable

Vous pouvez valoriser une variable avec une donnée de l'un des types suivants :

les nombres (entiers ou à virgules (le point est de rigueur en JavaScript)) ;
les chaînes de caractères (une suite de caractères encadrée par simples ou doubles quotes) ;
les booléens permettant de vérifier des conditions (true ou false) ;
le null permettant d'indiquer une valeur indéfinie.

en écrivant à droite de votre variable le signe "égal" suivi de la valeur devant être stockée :

var nomVille; nomVille = "Paris";

L'exemple ci-dessus montre la création de la variable nommée "nomVille" puis sa valorisation (dit affectation) par une chaîne de caractères "Paris".

Il est possible de raccourcir ce code en effectuant la valorisation lors de la création de la variable :

var nomVille = "Paris";

A noter que dans ce contexte, le nom réservé var (pour déclarer votre variable) devient facultatif. Ceci dit, prenez l'habitude de l'utiliser à chaque déclaration ceci afin de faciliter la lecture du script.

Valoriser une variable par opération mathématique

JavaScript propose des opérateurs de calcul permettant d'effectuer des opérations mathématiques. Ils peuvent bien sûr être associés afin de réaliser des opérations plus complexes (l'utilisation des parenthèses est recommandée). Les résultats peuvent ensuite être stockés dans des variables (selon les besoins) et peuvent faire l'objet d'autres opérations.

Les différentes opérations, décrites ci-après, impliquent toujours la même variable déclarée et valorisée telle que :

var x = 2;

Effectuer une addition

Pour effectuer une addition, on utilise le signe "plus" :

x = x + 8;

ou en utilisant l'opérateur d'affectation "plus égal" :

x += 8;

La variable "x", avant cette opération d'addition, est égale à 2. On ajoute 8 : la variable "x" est désormais égale à 10.

A noter qu'il existe un opérateur d'incrémentation (ajouter 1 à la variable "x") :

x++;

Effectuer une soustraction

Pour effectuer une soustraction, on utilise le signe "moins" :

x = x - 1;

ou en utilisant l'opérateur d'affectation "moins égal" :

x -= 1;

La variable "x", avant cette opération de soustraction, est égale à 10. On soustrait 1 : la variable "x" est désormais égale à 9.

A noter qu'il existe un opérateur de décrémentation (soustraire 1 de la variable "x") :

x--;

Effectuer une multiplication

Pour effectuer une multiplication, on utilise le signe "étoile" :

x = x * 4;

ou en utilisant l'opérateur d'affectation "étoile égal" :

x *= 4;

La variable "x", avant cette opération de multiplication, est égale à 9. On multiplie par 4 : la variable "x" est désormais égale à 36.

Effectuer une division

Pour effectuer une division, on utilise le signe "slash" :

x = x / 3;

ou en utilisant l'opérateur d'affectation "slash égal" :

x /= 3;

La variable "x", avant cette opération de multiplication, est égale à 36. On divise par 3 : la variable "x" est désormais égale à 12.

Obtenir le reste d'une division entière

Pour obtenir le reste d'une division entière, on utilise le signe "pourcentage" (dit "modulo") :

x = x % 5;

ou en utilisant l'opérateur d'affectation "pourcentage égal" :

x %= 5;

La variable "x", avant cette opération d'obtention du reste de la division entière, est égale à 12. On divise par 5 : la variable "x" est désormais égale au reste de cette division soit 2.

Concaténer des chaînes de caractères

Pour concaténer des chaînes de caractères, on utilise le signe "plus" :

var prenom = "Romain"; var bonjour = "Bonjour " + prenom + " !";

L'exemple ci-dessus montre la création et la valorisation de deux variables :

la variable "prenom" est créée avec comme valeur "Romain" ;
la variable "bonjour" est créée avec comme valeur la concaténation de 3 chaînes de caractères "Bonjour ", "Romain" et " !".

La variable "bonjour" a donc pour valeur "Bonjour Romain !". Toute modification ultérieure de la variable "prenom" n'aura aucune incidence sur la valeur de la variable "bonjour".

Il est également possible de concaténer en utilisant l'opérateur d'affectation "plus égal" :

var prenom = "Romain"; var bonjour = "Bonjour"; bonjour += " " + prenom + " !";

A noter que dans certains cas, la concaténation n'est pas forcément le but recherché. Pour illustrer ces propos, prenons cet exemple de code :

var calcul = 3 + "4";

L'exemple ci-dessus montre la création d'une variable "calcul" valorisée par la chaîne de caractères "34". En effet, la présence d'une chaîne de caractères ("4") implique de fait la concaténation.

Notre souhait était d'avoir le résultat de l'addition 3 + 4 et non d'avoir une concaténation des deux. Pour cela, il nous faut donc prévenir le moteur JavaScript que "4" doit être considérée comme nombre et non comme chaîne de caractères :

var calcul = 3 + parseInt("4");

La variable "calcul" est désormais égale à 7. Deux instructions permettent cette prévention :

parseInt : la chaîne de caractères doit être considérée comme nombre entier ;
parseFloat : la chaîne de caractères doit être considérée comme nombre à virgule.

Modifier une variable

La modification d'une variable correspond à une nouvelle valorisation :

var nomVille = "Paris"; nomVille = "Lille";

Une nouvelle valorisation provoque la perte de la précédente valeur stockée. Ainsi, dans l'exemple ci-dessus, la variable "nomVille" a :

pour valeur "Paris" lors de sa création ;
pour valeur "Lille" à la fin de l'exécution.

Supprimer une variable

Il n'existe aucun mécanisme en JavaScript nous permettant de supprimer une variable déclarée par le nom réservé "var".

Une nouvelle valorisation de la variable (à supprimer) par la valeur null ou undefined peut simuler cette suppression :

var nomVille = "Paris"; nomVille = "Lille"; nomVille = undefined;