Variables et Types de Données en JavaScript

Introduction

Bienvenue dans le monde de JavaScript ! Dans ce laboratoire, vous apprendrez deux des concepts les plus fondamentaux de la programmation : les variables et les types de données. Les variables sont comme des conteneurs qui stockent des informations, et les types de données définissent le type d'informations qu'une variable peut contenir.

Nous aborderons :

• La déclaration de variables à l'aide du mot-clé let.
• L'utilisation de trois types de données de base : String (texte), Number (valeurs numériques) et Boolean (vrai/faux).
• L'utilisation de la fonction console.log() pour afficher la sortie.
• La vérification du type de données d'une variable avec l'opérateur typeof.

À la fin de ce laboratoire, vous aurez une base solide pour travailler avec des données en JavaScript.

Déclarer une variable avec le mot-clé let

Dans cette étape, vous apprendrez comment déclarer une variable en JavaScript. Nous utilisons des mots-clés pour déclarer des variables, et l'un des plus courants est let. Le mot-clé let indique que vous créez une nouvelle variable qui pourra être réaffectée plus tard.

Tout d'abord, trouvez le fichier script.js dans l'explorateur de fichiers sur le côté gauche de l'IDE Web. Cliquez dessus pour l'ouvrir dans l'éditeur.

Maintenant, ajoutez la ligne de code suivante à script.js pour déclarer une variable nommée message.

let message;

Cette ligne indique au moteur JavaScript de réserver un espace en mémoire pour une variable appelée message. Elle n'a pas encore de valeur, ce qui signifie que sa valeur est undefined par défaut.

Assigner une valeur de type chaîne de caractères à la variable

Maintenant que vous avez déclaré une variable, donnons-lui une valeur. Nous commencerons par le type de données String (chaîne de caractères). Une chaîne est une séquence de caractères utilisée pour représenter du texte. En JavaScript, les chaînes sont entourées de guillemets simples (') ou de guillemets doubles (").

Nous utilisons l'opérateur d'affectation (=) pour assigner une valeur à une variable. Vous pouvez déclarer et assigner en deux étapes distinctes, mais il est plus courant de le faire sur une seule ligne.

Modifiez votre fichier script.js pour déclarer la variable message et lui assigner une valeur de type chaîne en une seule ligne. Remplacez le code existant par le suivant :

let message = "Hello, LabEx!";

Cette seule ligne crée la variable message et y stocke le texte "Hello, LabEx!".

Assigner une valeur numérique et afficher dans la console

Ensuite, explorons le type de données Number (nombre). Ce type est utilisé pour toutes les valeurs numériques, y compris les entiers (comme 10) et les nombres décimaux (comme 3.14).

Dans cette étape, vous apprendrez également à utiliser console.log(). Il s'agit d'une fonction JavaScript intégrée qui affiche des informations dans la console du développeur du navigateur. C'est un outil essentiel pour vérifier les valeurs de vos variables et déboguer votre code.

Ajoutez les lignes suivantes à la fin de votre fichier script.js. Cela créera une nouvelle variable userCount et affichera sa valeur dans la console.

let userCount = 100;
console.log(userCount);

Pour voir la sortie, cliquez sur l'onglet Web 8080 en haut de l'interface LabEx. Faites un clic droit sur la page, sélectionnez "Inspecter" (ou "Inspect Element"), puis cliquez sur l'onglet "Console" dans le panneau des outils de développement qui apparaît. Vous devriez voir le nombre 100 affiché dans la console.

Utiliser la valeur booléenne true ou false dans une variable

Le troisième type de données fondamental que nous allons aborder est le Boolean (booléen). Un booléen ne peut avoir que l'une des deux valeurs suivantes : true (vrai) ou false (faux). Les booléens sont le fondement de la logique et de la prise de décision en programmation.

Déclarons une variable booléenne. Ajoutez les lignes suivantes à la fin de votre fichier script.js pour créer une variable nommée isComplete et afficher sa valeur.

let isComplete = true;
console.log(isComplete);

Maintenant, retournez à l'onglet Web 8080 et regardez la console. Vous verrez la nouvelle sortie true imprimée sous le 100 de l'étape précédente.

Vérifier le type de variable avec l'opérateur typeof

Parfois, vous avez besoin de savoir quel type de données est stocké dans une variable. JavaScript fournit l'opérateur typeof à cet effet. Il renvoie une chaîne de caractères indiquant le type de l'opérande.

Dans cette dernière étape, vous utiliserez typeof pour inspecter le type de données de chaque variable que vous avez créée. Ajoutez les lignes suivantes à la fin de votre fichier script.js.

console.log(typeof message);
console.log(typeof userCount);
console.log(typeof isComplete);

Après avoir ajouté le code, basculez vers l'onglet Web 8080 et actualisez la page si nécessaire. Vérifiez la console. Vous verrez maintenant le type de données de chaque variable affiché.

La sortie attendue dans la console sera :

string
number
boolean

Résumé

Félicitations pour avoir terminé ce laboratoire ! Vous avez fait vos premiers pas en programmation JavaScript en découvrant les variables et les types de données fondamentaux.

Dans ce laboratoire, vous avez appris à :

• Déclarer des variables en utilisant le mot-clé let.
• Assigner des valeurs aux variables en utilisant l'opérateur d'affectation (=).
• Travailler avec trois types de données essentiels : String (chaîne de caractères), Number (nombre) et Boolean (booléen).
• Utiliser console.log() pour inspecter les valeurs et déboguer votre code.
• Utiliser l'opérateur typeof pour déterminer le type de données d'une variable.

Ces concepts sont les éléments constitutifs de toute application JavaScript. Au fur et à mesure que vous poursuivrez votre apprentissage, vous vous appuierez sur ces bases pour créer des programmes plus complexes et interactifs.