Partie 3 — Variables et types de données : penser comme JavaScript

Si JavaScript était une langue humaine, les variables seraient les mots que vous utilisez pour mémoriser des informations. Sans variables, un programme ne peut rien retenir, rien comparer, rien décider.

Avant de parler de fonctions, de conditions ou de projets complexes, il est essentiel de comprendre cette notion. Beaucoup de bugs viennent d’une mauvaise compréhension des variables et des types de données. Une fois cette partie maîtrisée, tout le reste devient plus clair.

1) Qu’est-ce qu’une variable ? (explication humaine)

Une variable, c’est tout simplement une boîte avec un nom dans laquelle on range une valeur. Cette valeur peut changer (ou pas), selon la façon dont on crée la variable.

Exemple dans la vie réelle :

• Une boîte appelée prix qui contient 120
• Une boîte appelée username qui contient "Ahmed"
• Une boîte appelée isLoggedIn qui contient true

En JavaScript, on crée une variable pour pouvoir :

• Stocker une information
• La réutiliser plus tard
• La modifier
• La comparer à autre chose

2) var, let et const : comprendre sans se compliquer

JavaScript propose trois mots-clés pour créer des variables : var, let et const. Ils font presque la même chose… mais pas exactement.

a) var — l’ancienne façon (à éviter au début)

var est l’ancienne manière de créer des variables. On la voit encore dans beaucoup de vieux tutoriels, mais aujourd’hui on l’utilise rarement.

var age = 25;
console.log(age);
    

Problème principal de var : il peut créer des comportements confus, surtout dans les blocs (if, for).

👉 Pour débuter, retenez ceci : évitez var.

b) let — la variable qui peut changer

let est la façon moderne de déclarer une variable dont la valeur peut évoluer dans le temps.

let score = 0;
score = score + 10;
console.log(score);
    

Ici, la variable score commence à 0, puis on lui ajoute 10. C’est exactement ce qu’on fait dans un jeu, un quiz ou un compteur.

c) const — la valeur qui ne doit pas changer

const sert à déclarer une variable dont la valeur ne doit pas être réassignée.

const TVA = 0.2;
    

Ici, le taux de TVA ne change pas pendant l’exécution du programme. C’est une excellente utilisation de const.

✅ Bonne pratique : utilisez const par défaut, et let seulement quand vous savez que la valeur doit changer.

3) Les types de données essentiels

En JavaScript, chaque valeur a un type. Le type indique à JavaScript comment il doit traiter cette valeur.

a) Les nombres (Number)

Les nombres servent à représenter des prix, des quantités, des scores, des âges, des totaux, etc.

let prix = 199;
let reduction = 20;
let total = prix - reduction;
console.log(total);
    

En JavaScript, il n’y a pas de différence entre entier et décimal :

let note = 15.5;
  

b) Les chaînes de caractères (String)

Les chaînes de caractères représentent du texte. Elles sont toujours entourées de guillemets.

let prenom = "Sara";
let message = 'Bienvenue sur le site';
  

Exemple pratique :

let username = "Mohamed";
console.log("Bonjour " + username);
  

c) Les booléens (true / false)

Les booléens représentent un état : vrai ou faux. Ils sont essentiels pour les conditions.

let isLoggedIn = true;
let isAdmin = false;
  

Exemple réel :

if (isLoggedIn) {
  console.log("Accès autorisé");
}
  

4) null et undefined : la différence (simplement)

Ces deux valeurs posent beaucoup de problèmes aux débutants. Pourtant, la logique est simple.

undefined

undefined signifie : “la variable existe, mais aucune valeur n’a été définie”.

let email;
console.log(email); // undefined
  

null

null signifie : “il n’y a volontairement aucune valeur”.

let phone = null;
  

👉 Résumé :
undefined = pas encore défini
null = vide volontairement

5) Exemples pratiques concrets

Exemple e-commerce :

const productName = "Casque Bluetooth";
let productPrice = 350;
let inStock = true;
  

Exemple utilisateur :

const username = "Yassine";
let age = 22;
let isVerified = false;
  

6) Erreurs fréquentes chez les débutants

❌ Oublier les guillemets

let nom = Ahmed; // erreur
  

❌ Réassigner une constante

const pays = "Maroc";
pays = "France"; // erreur
  

❌ Confondre texte et nombre

let a = "10";
let b = 5;
console.log(a + b); // "105"
  

👉 JavaScript ne devine pas vos intentions. Il applique des règles précises.

Dans la Partie 4, nous verrons comment JavaScript prend des décisions avec les opérateurs et les conditions (if, else, comparaisons, logique), pour transformer ces variables en vraie intelligence.