Variables et types primitifs

Objectifs

À la fin de cette leçon, vous saurez :

• déclarer une variable avec let et const, et choisir entre les deux sans hésiter ;
• nommer vos variables de façon lisible ;
• citer les types primitifs de JavaScript et vérifier le type d'une valeur avec typeof ;
• utiliser les opérateurs arithmétiques, de comparaison (stricts !) et logiques.

🔗 Pour vous rafraîchir la mémoire : votre premier programme

Variables : des étiquettes sur des valeurs

Une variable associe un nom à une valeur, pour pouvoir la réutiliser :

let age = 20;
const name = "Paul";

Lisez let age = 20; comme : « crée une étiquette nommée age, accroche-lui la valeur 20 ». Deux mots-clés possibles, deux contrats différents :

Mot-clé	Contrat	Quand l'utiliser
let	la valeur peut être remplacée plus tard	compteurs, totaux, valeurs qui évoluent
const	la valeur ne peut pas être remplacée	tout ce qui ne change pas — par défaut

Le contrat se vérifie immédiatement :

let age = 20;
age = 21;          // OK : let autorise le remplacement

const name = "Paul";
name = "Jean";     // TypeError: Assignment to constant variable

La règle adoptée par toute la communauté moderne : const par défaut, let seulement quand un remplacement est réellement nécessaire. Pourquoi ? Un lecteur du code voit const et sait d'avance que cette valeur restera stable : moins d'états mentaux à maintenir. Et si vous tentez quand même de la modifier, l'erreur survient aussitôt — plutôt que trois cents lignes plus loin.

Précision utile : déclarer deux fois la même variable est une erreur (SyntaxError: Identifier 'age' has already been declared). Une variable se déclare une fois ; ensuite on la lit ou on la remplace.

Bien nommer : le code se lit cent fois plus qu'il s'écrit

// mal nommé : correct mais illisible
let x = 12;
let q = 3;
console.log(x * q);

// bien nommé : le programme se comprend sans commentaire
const prixUnitaire = 12;
const quantite = 3;
console.log(prixUnitaire * quantite);

Conventions en vigueur :

• camelCase : prixUnitaire, pas prix_unitaire ni Prixunitaire ;
• noms descriptifs : total plutôt que t, estValide plutôt que flag ;
• constantes « de configuration » en MAJUSCULES : const TAUX_TVA = 1.2 ;
• pas d'accents dans les identifiants : quantite, pas quantité.

Les types primitifs

Un type décrit la nature d'une valeur — et détermine ce qu'on peut en faire. On peut additionner deux nombres ; multiplier deux textes n'a aucun sens :

let texte   = "Bonjour";          // string  : du texte
let nombre  = 42;                 // number  : entier ou décimal
let decimal = 3.14;               // number aussi (un seul type numérique)
let vrai    = true;               // boolean : true ou false
let rien    = null;               // null    : absence VOLONTAIRE de valeur
let vide;                         // undefined : jamais de valeur donnée

Deux absences ? Oui, et la nuance est utile :

• undefined : « personne n'a encore mis rien ici » — valeur par défaut d'une variable non initialisée, résultat d'une fonction sans return... ;
• null : « il y a délibérément rien, et c'est voulu » — typiquement : « aucun utilisateur connecté », « aucune erreur ».

Deux autres types existent pour des usages rares : bigint (entiers arbitrairement grands) et symbol (identifiants uniques). Vous les rencontrerez peu ; retenez qu'ils existent.

Anecdote instructive, testez-la :

console.log(typeof null);   // "object"  ← oui, vraiment

C'est un bug historique de 1995, jamais corrigé pour ne pas casser le web existant. Morale : même les langages ont leurs cicatrices — et typeof reste votre outil de vérification.

typeof : demander son type à une valeur

$ node
> typeof 42
'number'
> typeof "42"
'string'
> typeof true
'boolean'
> typeof undefined
'undefined'
> typeof [1, 2]
'object'

Notez la dernière ligne, très importante : "42" (texte) et 42 (nombre) sont deux valeurs différentes. L'une est manipulable comme texte, l'autre comme nombre. Le type appartient à la valeur, pas au conteneur.

Conséquence : JavaScript est dynamiquement typé — la même variable peut recevoir successivement des types différents, sans erreur :

let boite = 42;
boite = "quarante-deux";   // autorisé... mais rarement une bonne idée

C'est flexible, mais dangereux si abusé : impossible alors de savoir ce que contient la variable sans lire tout le programme. Bonne pratique : une variable garde un seul type de contenu pendant toute sa vie. (Et TypeScript, en partie 6 du cursus, transformera cette bonne pratique en règle vérifiée.)

Les opérateurs arithmétiques

console.log(7 + 3);    // 10   addition
console.log(7 - 3);    // 4    soustraction
console.log(7 * 3);    // 21   multiplication
console.log(7 / 2);    // 3.5  division (pas de division entière surprise)
console.log(7 % 3);    // 1    modulo : le RESTE de la division
console.log(2 ** 10);  // 1024 puissance

Le modulo % mérite une explication, car il reviendra tout le cursus : 7 % 3 demande « combien reste-t-il après avoir retiré autant de fois 3 que possible ? » → 7 = 3×2 + 1. Son usage vedette est le test de parité : un nombre est pair exactement quand n % 2 === 0. Il sert aussi à « boucler » dans un intervalle fixe (compter les minutes : minutes % 60).

Petits raccourcis quotidiens :

let total = 10;
total += 5;    // équivaut à : total = total + 5  → 15
total++;       // +1                              → 16
total--;       // −1                              → 15

Attention à la priorité des opérateurs, héritée des mathématiques : * et / avant + et -. En cas de doute, mettez des parenthèses — elles sont gratuites et lisibles : (a + b) / 2.

Comparer : strictement, toujours

console.log(5 > 3);      // true
console.log(5 < 3);      // false
console.log(5 >= 5);     // true
console.log(5 <= 4);     // false
console.log(5 === 5);    // true
console.log(5 !== 6);    // true

Et voici LA règle de discipline du langage :

console.log(5 === "5");   // false : types différents, point final
console.log(5 == "5");    // true  : conversion silencieuse avant comparaison !

=== compare type ET valeur (égalité stricte). == compare après avoir tenté des conversions implicites — source infinie de surprises : "" == 0 vaut true, null == undefined aussi. Toute la communauté a abandonné == : écrivez systématiquement === et !==. Si vous voulez vraiment convertir avant de comparer, faites-le explicitement :

console.log(Number("42"));    // 42    : texte → nombre
console.log(String(42));      // "42"  : nombre → texte
console.log(Number("abc"));   // NaN   : Not a Number — échec annoncé

NaN mérite une mention : c'est la valeur obtenue quand un calcul numérique échoue ("a" * 3, Number("abc")). Particularité troublante : NaN === NaN vaut false (« pas un nombre » n'est égal à rien, pas même à lui-même).

Combiner des booléens

Les opérateurs logiques assemblent des conditions :

const age = 25;
const aPermis = true;

console.log(age >= 18 && aPermis);        // true : ET logique — les DEUX vrais
console.log(age < 18 || aPermis);         // true : OU logique — AU MOINS UN vrai
console.log(!aPermis);                    // false : NON logique — inversion

Ils s'appliquent souvent au résultat de comparaisons, comme ci-dessus — c'est ainsi qu'on écrit « majeur et titulaire du permis ». La lecture se fait naturellement : && se dit « et », || se dit « ou », ! se dit « non ».

Assembler du texte proprement : template literals

const prenom = "Paul";
const age = 20;

console.log("Bonjour " + prenom + ", tu as " + age + " ans."); // pénible
console.log(`Bonjour ${prenom}, tu as ${age} ans.`);            // lisible

Les backticks créent une chaîne modèle : chaque ${expression} est calculée puis insérée. L'expression peut être complexe : `Total : ${(prix * quantite).toFixed(2)} €`. C'est la forme standard dès maintenant — adoptez-la.

Exercice

1. Prédisez puis testez chaque ligne :

   let a = 5;
   let b = "5";
   console.log(a + 1);
   console.log(b + 1);
   console.log(a === b);
   console.log(a == b);
   console.log(typeof b);
   

2. Déclarez const PRIX = 12 et let quantite = 3 ; affichez le total.
3. Affichez le type de PRIX, de quantite, puis de PRIX * quantite.
4. Écrivez une expression qui teste si quantite est paire.
5. Expliquez pourquoi console.log("50" / 5) vaut 10 alors que console.log("50" + 5) vaut "505".
6. Avec const nom = "Awa" et const age = 31, construisez une phrase complète via backticks incluant les deux valeurs.

Résumé

• const par défaut, let si besoin de remplacer ; une déclaration par variable.
• Types primitifs : string, number, boolean, null (absence voulue), undefined (jamais rempli).
• typeof révèle le type ; le type appartient à la valeur.
• ===/!== toujours — jamais ==.
• % donne le reste (test de parité), conversions explicites avec Number()/String().
• Backticks + ${} pour assembler du texte.

console.log(a + 1);     // 6     : opération entre nombres
console.log(b + 1);     // "51"  : devant un TEXTE, + concatène !
console.log(a === b);   // false : number vs string
console.log(a == b);    // true  : == convertit "5" en 5 avant de comparer
console.log(typeof b);  // "string"

const PRIX = 12;
let quantite = 3;
console.log(PRIX * quantite);   // 36

console.log(typeof PRIX);           // "number"
console.log(typeof quantite);       // "number"
console.log(typeof (PRIX * quantite)); // "number"

console.log(quantite % 2 === 0);   // true (3 % 2 vaut 1 → false en fait !)

const nom = "Awa";
const age = 31;
console.log(`${nom} a ${age} ans et habite à Dakar.`);
// Awa a 31 ans et habite à Dakar.