Bienvenue à ce nouveau tuto dans le quel nous allons apprendre la déclaration des variables dans JavaScript 🙂 🙂

accès rapide

• La démo
• Qu’est ce qu’une variable ?
• Comment déclarer une variable ?
• Différence entre let , var et const
• Comment choisir le nom de ma variable ?
• Quiz de ce tuto

La démo

mettre ici la vidéo de la démonstration

Qu’est ce qu’une variable ?

Pour faire simple, une variable est un conteneur (caractérisé par son nom) qui garde des valeurs durant toute l’exécution de notre programme.

Les variables en JavaScript ne sont pas typés, c’est-à-dire qu’elles peuvent contenir toutes sortes d’informations comme un nombre entier une chaîne de caractères, un tableau…

Autrement dit, nous n’avons pas besoin de mettre le type de la variable pour la déclarer c’est à dire le langage déterminera automatiquement le type d’une variable, donc pas besoin de spécifier le type d’une variable à sa création.

Comment déclarer une variable ?

En Javascript, pour déclarer une variable nous pouvons utiliser trois mots clé : let, const et var.

let et var permettent de déclarer des variables qui peuvent changer durant l’exécution du programme.

const quand à lui permet de déclarer des constantes qui ne changeront pas durant l’exécution du programme.

Exemple de déclaration :

var user = 'John'
let age = 25
const message = 'Hello'

• var sert à définir une variable globale
• let sert à définir une variable locale
• const sert à déclarer une référence constante

Découvrons maintenant quelques exemple en pratique pour mieux voir la différence entre ces trois déclarations :

Se limite à la portée d’un bloc ?

• var : non ❌
• let : oui ✔️
• const : oui ✔️

Explication

Un bloc est l’ensemble des instructions comprises entre deux accolades « {…} »

Donc si on déclare une var dans une fonction, nous pouvons récupérer le contenu de cette variable en dehors de cette fonction. Cependant, let et const sont reconnues que dans le bloc dans lequel elles sont déclarées.

Cet exemple explique bien cette propriété :

Nous allons faire un test rapide, allez dans la console de votre navigateur en exécutant ce raccourcis (ctrl + shift + i) et suivez étape par étape ce qui est motionné dans cette explication :

1- Déclarer une variable booléenne :

var test = true  // déclarer une variable booléenne

2- Déclarer et afficher les trois types de variable dans un même bloc :

if (test)
{
    var a = 20 
    let b = 30
    const c = 40
    console.log(a) // la console affiche 20 
    console.log(b) // la console affiche 30 
    console.log(c) // la console affiche 40 
}

3- Essayer d’utiliser les trois type en dehors du bloc précédant :

console.log(a) // la console affiche 20 
console.log(b) // la console affiche l'erreur b is not defined 
console.log(c) // la console affiche l'erreur c is not defined

Résultat :

Cet exemple montre que let et const se limitent à la portée d’un bloc donc elles ne sont pas disponibles en dehors de ce bloc

Stocké en global ?

• var : oui ✔️
• let : non ❌
• const : non ❌

C’est à dire var est utilisé pour définir une variable globale donc à n’importe quelle fonction du programme le contenu de cette variable peut être utilisé.

Explication

Donc si on déclare une var dans un bloc , nous pouvons récupérer le contenu de cette variable en dehors de cette fonction. Cependant, let et const sont reconnues que dans le bloc dans lequel elles sont déclarées.

Cet exemple explique bien cette propriété :

Nous allons faire un test rapide, allez dans la console de votre navigateur en exécutant ce raccourcis (ctrl + shift + i) et suivez étape par étape ce qui est motionné dans cette explication :

1- Déclarer les trois types de variables dans un bloc :

{
    var a = 20 
    let b = 30
    const c = 40
}

2- Essayer d’afficher ces trois types de variable après la fin de ce bloc :

console.log(a) // la console affiche 20 
console.log(b) // la console affiche l'erreur b is not defined 
console.log(c) // la console affiche l'erreur c is not defined 

Résultat :

Cet exemple montre que let et const se limitent à la portée d’un bloc tandis que var possède un critère globale donc elle est reconnue tout les long de l’exécution du programme.

Peut être modifiée ?

• var : oui ✔️
• let : oui ✔️
• const : non ❌

C’est à dire nous pouvons modifier les valeurs des variables déclarées comme étant var ou let tandis que le contenue de const reste inchangeable.

Cet exemple explique bien cette propriété :

Nous allons faire un test rapide, allez dans la console de votre navigateur en exécutant ce raccourcis (ctrl + shift + i) et suivez étape par étape ce qui est motionné dans cette explication :

1- Déclarer les trois types de variable :

var a = 20 
let b = 30
const c = 40

2- Essayer de modifier la valeur de ces trois variables :

a = 22  // la valeur a été modifiée à 22  
b = 33  // la valeur a été modifiée à 33   
c = 44  // une erreur s'affiche: on peut pas modifier le contenu

Résultat :

Cet exemple montre qu’on peut modifier les valeurs des variables let et var. Cependant, la valeur de const ne peut pas être modifiée.

Comment choisir le nom de ma variable ?

Le nom d’une variable en JavaScript doit respecter les conditions suivantes :

• commencer par une lettre , un underscore (tiret du bas « _ ») ou le signe $
• Pour le reste du nom,il ne doit contenir que : de lettres, chiffres, underscore et $
• Pas d’espace dans le nom d’une variable, mais vous pouvez utiliser une parmi ces méthodes pour que le nom sera facile à comprendre:

1. utiliser le camelCase () par exemple si vous voulez déclarer la variable qui prendrai comme valeur un nom d’une personne vous pouvez mettre: nomPersonne
2. utiliser les underscores () par exemple si vous voulez déclarer la variable qui prendrai comme valeur un prénom d’une personne vous pouvez mettre: prenom_personne

• ne pas utiliser pas les mots clés réservés par JavaScript : exemple ne pas mettre les noms suivants : var , if , const , for, int, etc..

Javascript est sensible à la casse, cela veut dire que la variable birthDate est différente de BirthDate qui est aussi différente birthdate .

Exercice d’application :

Parmi les noms des variables ci-dessous , indiquez les noms valides :

• 3_tiers
• NomPersonne
• Prenom Personne
• Age200
• $ligne_Facture
• let_nom
• for
• nom&prenom

Correction

Dans ce tuto , nous avons vu comment déclarer les variables en JavaScript.

Espérons bien que ce tuto vous a plu. Dans le tuto suivant , Nous allons voir quels sont les types de données qu’on peut mettre dans les variables.

Quiz de ce tuto

Vous pouvez tester que vous avez bien assimiler tous ce que nous avons appris ensemble via ce quiz 🙂 🙂 amusez vous bien.

/8

0 votes, 0 avg

18

Créé le janvier 01, 2023

Quiz JavaScript : Déclaration de variables

Ce quiz vous aide à améliorer vos connaissances en JavaScript 🙂 🙂 

1 / 8

1. cette déclaration est valide dans JavaScript

Faux

vrai

Explication de la Réponse :
En Javascript, pour déclarer une variable nous pouvons utiliser que l'une de ces trois mots clé : let, const et var.

2 / 8

2. Quelle sera la sortie de ce code ?

une erreur se déclenche : la variable "note" a été déjà déclarée

aucune erreur se déclenche

la console affiche : 20

la console affiche : 16

Explication de la Réponse :
On peut mettre deux variables avec le même nom à condition ils ne sont pas dans le même bloc ==> d'où pas d'erreur
le contenu de let note a été modifié seulement dans le bloc donc en dehors du bloc il en a une var note
==> console.log(note) va afficher le contenu de var note qui est 16.

3 / 8

3. let sert à définir une référence constante :

Faux

vrai

Explication de la Réponse :
const sert à déclarer une référence constante

4 / 8

4. Quelle sera la sortie de ce code ?

la console affiche la valeur 20

la console affiche la valeur 21

la console affiche une erreur : la variable age n'est pas reconnue.

Explication de la Réponse :
Donc si on déclare une var dans un bloc , nous pouvons récupérer le contenu de cette variable en dehors de cette fonction. Cependant, let et const sont reconnues que dans le bloc dans lequel elles sont déclarées.

5 / 8

5. On peut modifier la valeur d'une variable déclarée comme étant const

Faux

vrai

6 / 8

6. sélectionner les noms des variables valides

date-debut

nom_2_variable

while

$couleur

Explication de la Réponse :
date-debut : non ❌ : car ça contient un tiret "-" non par un underscore
nom_2_variable : oui ✔️ : car ça contient que des lettres , des chiffres et des undersores.
while : non ❌ : car c'est un mot réservé
$couleur : oui ✔️ : car ça contient que des lettres et le caractère "$" qui est permit dans JavaScript

7 / 8

7. Quelle sera la sortie de ce code ?

une erreur se déclenche : variable test n'est pas reconnue

une erreur se déclenche : variable moyenne n'est pas reconnue

la console affiche : true

la console affiche : 16

Explication de la Réponse :
La variable test est déclarée à l'aide du mot clé var donc elle sera disponible partout ==> d'où l'affichage de true.
La variable moyenne est déclarée à l'aide du mot clé let donc elle sera disponible que dans son bloc et pas en dehors ==> d'où l'affichage d'une erreur dans la ligne console.log(moyenne).

8 / 8

8. une variable déclarée comme étant var est stockée en global ?

Faux

vrai

Votre note est de

LinkedIn Facebook Twitter VKontakte

0%

Relancer le quiz

Veuillez évaluer ce quiz

Envoyer les commentaires