La plupart du temps, une application JavaScript doit utiliser des informations. Voici 2 exemples :
- Une boutique en ligne – les informations peuvent inclure des articles vendus et un panier d’achat.
- Une application de chat – les informations peuvent inclure des utilisateurs, des messages et bien plus encore.
Les variables sont utilisées pour stocker ces informations.
Une variable
Une variable est un “stockage nommé” pour les données. Nous pouvons utiliser des variables pour stocker des goodies, des visiteurs et d’autres données.
Pour créer une variable en JavaScript, nous devons utiliser le mot-clé let.
L’instruction ci-dessous crée (autrement dit: déclare) une variable avec le nom “message” :
let message;
Maintenant, nous pouvons y mettre des données en utilisant l’opérateur d’affectation = :
let message;
message = 'Hello'; // stocke la chaîne de caractères 'Hello' dans la variable nommée message
La chaîne de caractères est maintenant enregistrée dans la zone de mémoire associée à la variable. Nous pouvons y accéder en utilisant le nom de la variable :
let message;
message = 'Hello!';
alert(message); // affiche le contenu de la variable
Pour être concis, nous pouvons fusionner la déclaration et l’affectation de variables en une seule ligne :
let message = 'Hello!'; // définir la variable et assigner la valeur
alert(message); // Hello!
Nous pouvons également déclarer plusieurs variables sur une seule ligne :
let user = 'John', age = 25, message = 'Hello';
Cela peut sembler plus court, mais ce n’est pas recommandé. Pour une meilleure lisibilité, veuillez utiliser une seule ligne par variable.
La variante multiligne est un peu plus longue, mais plus facile à lire :
let user = 'John';
let age = 25;
let message = 'Hello';
Certaines personnes définissent également plusieurs variables dans ce style multiligne :
let user = 'John',
age = 25,
message = 'Hello';
… Ou même dans le style “virgule première” :
let user = 'John'
, age = 25
, message = 'Hello';
Techniquement, toutes ces variantes font la même chose. C’est donc une question de goût personnel et d’esthétique.
var au lieu de letDans les anciens scripts, vous pouvez également trouver un autre mot-clé : var au lieu de let :
var message = 'Hello';
Le mot-clé var est presque identique à let. Il déclare également une variable, mais d’une manière légèrement différente, à la mode “old school”.
Il y a des différences subtiles entre let et var, mais elles n’ont pas encore d’importance pour nous. Nous les couvrirons en détails plus tard, dans le chapitre L'ancien "var".
Une analogie avec la vie réelle
Nous pouvons facilement saisir le concept d’une “variable” si nous l’imaginons comme une “boîte” pour les données, avec un autocollant portant un nom unique.
Par exemple, la variable message peut être imaginée comme une boîte étiquetée “message” avec la valeur “Hello!” à l’intérieur :
Nous pouvons mettre n’importe quelle valeur dans la boîte.
On peut aussi le changer autant de fois qu’on veut :
let message;
message = 'Hello!';
message = 'World!'; // valeur changée
alert(message);
Lorsque la valeur est modifiée, les anciennes données sont supprimées de la variable :
Nous pouvons également déclarer deux variables et copier des données de l’une à l’autre.
let hello = 'Hello world!';
let message;
// copier 'Hello world' de hello vers message
message = hello;
// maintenant les deux variables contiennent les mêmes données
alert(hello); // Hello world!
alert(message); // Hello world!
Une variable ne doit être déclarée qu’une seule fois.
Une déclaration répétée de la même variable est une erreur :
let message = "This";
// répéter 'let' conduit à une erreur
let message = "That"; // SyntaxError: 'message' has already been declared
Donc, nous devrions déclarer une variable une fois et y faire référence sans let.
Il peut être intéressant de savoir qu’il existe aussi des langages de programmation purement fonctionelle, comme Haskell qui interdisent de modifier une valeur de variable.
Dans ce genre de langage, une fois la valeur stockée dans la boîte, elle est là pour toujours. Si nous devons stocker autre chose, le langage nous oblige à créer une nouvelle boîte (déclarer une nouvelle variable). Nous ne pouvons pas réutiliser l’ancienne.
Bien que cela puisse paraître un peu étrange à première vue, ces langages sont tout à fait capables de développements sérieux. Plus que cela, il existe des domaines tels que les calculs parallèles où cette limitation confère certains avantages.
Nom de variable
Il existe deux limitations pour un nom de variable en JavaScript :
- Le nom ne doit contenir que des lettres, des chiffres, des symboles
$et_. - Le premier caractère ne doit pas être un chiffre.
Noms valides, par exemple :
let userName;
let test123;
Lorsque le nom contient plusieurs mots, le camelCase est couramment utilisé. C’est-à-dire que les mots se succèdent, chaque mot à l’exception du premier commence par une majuscule : monTresLongNom.
Ce qui est intéressant – le signe dollar '$' et l’underscore '_' peuvent également être utilisé dans les noms. Ce sont des symboles réguliers, tout comme les lettres, sans aucune signification particulière.
Ces noms sont valides :
let $ = 1; // déclarer une variable avec le nom "$"
let _ = 2; // et maintenant une variable avec le nom "_"
alert($ + _); // 3
Exemples de noms de variables incorrects :
let 1a; // ne peut pas commencer avec un chiffre
let mon-nom; // un trait d'union '-' n'est pas autorisé dans le nom
Des variables nommées apple et APPLE sont deux variables différentes.
Il est possible d’utiliser n’importe quelle langue, y compris les lettres cyrilliques, les logogrammes chinois, etc., comme ceci :
let имя = '...';
let 我 = '...';
Techniquement, il n’y a pas d’erreur ici, ces noms sont autorisés, mais il existe une convention internationale d’utiliser l’anglais dans les noms de variables. Même si nous écrivons un petit script, sa vie peut être longue. Les personnes d’autres pays peuvent avoir besoin de les lire quelque temps.
Il existe une liste de mots réservés, qui ne peuvent pas être utilisés comme noms de variables, car ils sont utilisés par le langage lui-même.
Par exemple, les mots let, class, return, function sont réservés.
Le code ci-dessous donne une erreur de syntaxe :
let let = 5; // impossible de nommer une variable "let", erreur!
let return = 5; // on ne peut pas la nommer "return" aussi, erreur!
use strictNormalement, nous devons définir une variable avant de l’utiliser. Mais jadis, il était techniquement possible de créer une variable par simple affectation de la valeur, sans let. Cela fonctionne toujours maintenant si nous ne mettons pas use strict. Le comportement est conservé pour la compatibilité avec les anciens scripts.
// note : pas de "use strict" dans cet exemple
num = 5; // la variable "num" est créée si elle n'existe pas
alert(num); // 5
C’est une mauvaise pratique, cela donne une erreur en mode strict :
"use strict";
num = 5; // erreur: num n'est pas défini
Les Constantes
Pour déclarer une constante (non changeante), on peut utiliser