Nous allons effectuer ici quelques exercices sur les variables en Javascript.
Pour cela nous allons également voir la concaténation de base à connaitre puis nous allons afficher dans la console et dans la fenêtre du navigateur des informations utilisateurs.

La Concaténation en JavaScript

La concaténation en JavaScript consiste à combiner ou à joindre des chaînes de texte (ou d'autres valeurs) pour former une nouvelle chaîne.

Nous allons maintenant passer à la pratique.
Créez un dossier nommé : variables.
A l'intérieur de celui-ci créez un fichier variable.html et un fichier variable.js.
Mettez votre script qui fera appel à votre fichier variable.js avant la balise </body>.

Nous allons voir ici deux exemples simples où nous allons déclarer des variables et écrire du texte tout en récupérant la valeur des variables.
Dans un premier temps, nous afficherons ces exemples dans la console puis ce sera à votre tour avec trois petits exercices.
Nous reprendrons ensuite ces exemples et les afficheront dans une fenêtre du navigateur.

 

Tapez ce code dans votre fichier variable.js :

let prenom = "Jessy";
console.log(prenom);

Placez-vous sur votre fichier variable.html et ouvrez votre navigateur (en cliquant sur Go Live par exemple si vous utilisez VsCode).

Ouvrez également la console de votre navigateur (F12 ou ctrl + shift + i). Vous devriez voir ceci d'afficher :

console exo1 Javascript

 

let prenom = "Jessy";  : Nous commençons par déclarer la variable "prenom" auquel nous avons affecté la valeur "Jessy" qui est de type string.
Rappel : String correspond à une chaîne de caractères (un texte). La chaîne de caractères doit être entourée d'apostrophes doubles ou simples.

console.log(prenom); : Nous utilisons la console pour afficher le contenu de la variable "prenom".

 

Voyons maintenant un autre exemple, tapez ceci dans votre fichier variable.js :

let age = 30;
let message = "J'ai " + age + " ans.";
console.log(message); // Affiche "J'ai 30 ans."

Résultat dans la console :
console exo 1 javascript

let age = 30;
Nous déclarons une variable appelée "age" et lui attribuons la valeur 30. (rappel : une variable est un espace de stockage pour les données).

let message = "J'ai  " + age + " ans."; Nous créons une nouvelle variable appelée "message". Cette variable contient une chaîne de caractères (ou chaîne de texte) qui combine plusieurs éléments :
"J'ai  " : C'est une partie fixe du message avec un espace à la fin pour que le texte ne soit pas collé.
age : C'est la valeur de la variable "age" que nous avons déclarée précédemment (30 dans ce cas).
" ans." : C'est une autre partie fixe du message.
L'opérateur + est utilisé pour concaténer des chaînes de texte ou des valeurs. Nous verrons par la suite d'autres façons de concaténer.

console.log(message); : Nous utilisons console.log pour afficher le contenu de la variable "message" dans la console du navigateur.

Nous aurions également pu écrire cet exemple de cette façon :

let age = 30;
console.log("J'ai " + age + " ans.");
Vous avez pu remarquer le point-virgule à chaque fin de ligne. Ce n'est pas obligatoire, c'est à votre choix.

 

La console

La console est un outil polyvalent et indispensable qui facilite le développement, le débogage, la surveillance et l'apprentissage du langage.
Elle vous permet d'interagir avec votre code, de comprendre son comportement et de résoudre efficacement les problèmes qui se posent pendant le développement.

 

A vous !
Objectif : afficher dans la console votre nom et prénom.
Résultat attendu :
exercice variable js

Retour en haut