Variables & Types

En JavaScript, nous utilisons let et const pour déclarer des variables.

var - OBSOLÈTE

Ne jamais utiliser var !

Utilisez toujours let ou const.

Pourquoi var est obsolète ?

var était la seule façon de déclarer des variables avant ES6 (2015). Mais il a des problèmes majeurs :

Problème 1 : Portée (scope) bizarre

javascript
// var a une portée de fonction, pas de bloc
if (true) {
  var x = 10;
}
console.log(x); // 10 - accessible en dehors du if ! 😱

// let/const ont une portée de bloc (plus logique)
if (true) {
  let y = 10;
}
console.log(y); // ❌ ReferenceError: y is not defined

Problème 2 : Hoisting (remontée)

javascript
// var est "remonté" au début de la fonction
console.log(name); // undefined (pas d'erreur!)
var name = 'Alice';

// let/const donnent une erreur claire
console.log(age); // ❌ ReferenceError: Cannot access 'age' before initialization
let age = 25;

Problème 3 : Redéclaration possible

javascript
// var permet de redéclarer la même variable
var count = 1;
var count = 2; // Pas d'erreur 😱
console.log(count); // 2

// let/const empêchent la redéclaration
let score = 1;
let score = 2; // ❌ SyntaxError: Identifier 'score' has already been declared

Problème 4 : Pollution du scope global

javascript
// var dans le scope global devient une propriété de window
var globalVar = 'danger';
console.log(window.globalVar); // 'danger' 😱

// let/const restent dans leur scope
let globalLet = 'safe';
console.log(window.globalLet); // undefined ✅

La bonne approche

Toujours utiliser :

  • const par défaut (valeur qui ne change pas)
  • let seulement si vous devez réassigner

Ne jamais utiliser var - c'est du code ancien (pre-2015).

Types primitifs

JavaScript a plusieurs types de base (primitifs).

number

javascript
const age = 25;
const pi = 3.14;
const negatif = -7;
const infini = Infinity;
const pasUnNombre = NaN; // Not a Number

Astuce

JavaScript n'a qu'un seul type numérique (format IEEE 754 64 bits, aussi appelé "double precision"). Pas de distinction int/float/double comme en Java ou C++.

NaN - Not a Number

NaN représente une valeur qui devrait être un nombre mais ne l'est pas. C'est le résultat d'opérations mathématiques invalides.

javascript
// Quand obtient-on NaN ?
const resultat1 = 0 / 0;              // NaN
const resultat2 = Math.sqrt(-1);      // NaN (racine carrée d'un négatif)
const resultat3 = parseInt('hello');  // NaN (conversion impossible)
const resultat4 = 'text' * 5;         // NaN (opération invalide)

// NaN a un comportement bizarre !
console.log(NaN === NaN);  // false (!!)
console.log(NaN == NaN);   // false

// Pour vérifier si une valeur est NaN :
console.log(isNaN(NaN));              // true
console.log(Number.isNaN(NaN));       // true (plus fiable)

// Différence entre les deux :
console.log(isNaN('hello'));          // true (converti d'abord en Number)
console.log(Number.isNaN('hello'));   // false (vérifie strictement)

NaN n'est pas égal à lui-même !

NaN est la seule valeur en JavaScript qui n'est pas égale à elle-même. C'est pour cette raison qu'on utilise Number.isNaN() pour le vérifier.

javascript
if (resultat === NaN) {  // ❌ Ne fonctionne jamais !
  console.log('NaN détecté');
}

if (Number.isNaN(resultat)) {  // ✅ Bon
  console.log('NaN détecté');
}

string

Les chaînes de caractères représentent du texte.

javascript
const simple = 'Hello';
const double = "World";
const template = `Hello ${simple}`;

Information

Les strings seront détaillés dans la page suivante avec les template literals !

boolean

javascript
const vrai = true;
const faux = false;

// Souvent utilisé pour des conditions
const isLoggedIn = true;
const hasPermission = false;

undefined et null

javascript
// undefined - variable déclarée mais non initialisée
let x;
console.log(x); // undefined

// null - absence volontaire de valeur (sera assignée plus tard)
let currentUser = null;  // Pas encore d'utilisateur connecté
// ... plus tard, après login
currentUser = { name: 'Alice', id: 123 };

Quelle est la différence entre undefined et null ?

BigInt (ES2020)

Pour les très grands nombres entiers (au-delà de Number.MAX_SAFE_INTEGER).

javascript
const veryBig = 9007199254740991n; // Notez le 'n' à la fin
const alsoVeryBig = BigInt(9007199254740991);

console.log(veryBig + 1n); // 9007199254740992n

Information

Rarement utilisé dans les applications web classiques. Utile pour la cryptographie, les timestamps précis, ou les calculs financiers.

Symbol (ES2015)

Crée des identifiants uniques. Avancé, rarement utilisé directement.

javascript
const id1 = Symbol('id');
const id2 = Symbol('id');
console.log(id1 === id2); // false (toujours unique)

typeof

L'opérateur typeof permet de vérifier le type d'une valeur.

javascript
typeof 42;        // "number"
typeof "hello";   // "string"
typeof true;      // "boolean"
typeof undefined; // "undefined"
typeof null;      // "object" (bug historique!)
typeof [];        // "object" (les tableaux sont des objets!)
typeof {};        // "object"

Bug historique

typeof null retourne "object" au lieu de "null". C'est un bug qui date de la création de JavaScript et qui n'a jamais été corrigé pour des raisons de compatibilité.

Pour vérifier si une valeur est null, utilisez === null directement.

Que retourne typeof [] ?

Déclaration de variables

let - Variable

Peut être réassignée.

javascript
let count = 0;
count = 1; // OK
count = count + 1; // OK

Utilisez let quand :

  • La valeur va changer (compteur, accumulation)
  • Dans une boucle
  • Pour des valeurs temporaires
javascript
// Exemple pratique : boucle
for (let i = 0; i < 5; i++) {
  console.log(i); // i change à chaque itération
}

// Accumulation
let total = 0;
total += 10;
total += 20;
console.log(total); // 30

const - Constante

Ne peut pas être réassignée.

javascript
const PI = 3.14;
PI = 3; // ❌ Error!

Utilisez const quand :

  • La référence ne doit pas changer
  • Pour la plupart de vos variables (par défaut)
  • Pour les fonctions, objets, tableaux
javascript
// Exemple pratique : valeurs qui ne changent pas
const API_URL = 'https://api.example.com';
const MAX_RETRIES = 3;
const user = { name: 'Alice', age: 25 };

Quand devriez-vous utiliser let plutôt que const ?

const avec objets/tableaux

Important : const empêche la réassignation, pas la mutation !

javascript
const user = { name: 'Alice' };
user.name = 'Bob'; // ✅ OK (mutation)
user = {}; // ❌ Error (réassignation)

const numbers = [1, 2, 3];
numbers.push(4); // ✅ OK (mutation)
numbers = []; // ❌ Error (réassignation)

const protège la référence, pas le contenu.

Conventions de nommage

Bien nommer vos variables rend votre code lisible et compréhensible.

camelCase (standard JavaScript)

La convention principale en JavaScript : première lettre minuscule, puis majuscule à chaque nouveau mot.

javascript
const firstName = 'Alice';
const numberOfUsers = 42;
const isLoggedIn = true;
const hasPermission = false;

SNAKE_CASE_MAJUSCULE pour les constantes globales

Pour les valeurs qui ne changeront jamais (configuration, constantes mathématiques).

javascript
const MAX_LOGIN_ATTEMPTS = 3;
const API_BASE_URL = 'https://api.example.com';
const DEFAULT_TIMEOUT = 5000;
const PI = 3.14159;

Préfixes pour les booléens

Utilisez des préfixes qui rendent le code auto-documenté.

javascript
// ✅ Bon - on comprend que c'est un boolean
const isActive = true;
const hasAccess = false;
const canEdit = true;
const shouldRefresh = false;

// ❌ Mauvais - pas clair
const active = true;
const access = false;

Noms descriptifs

javascript
// ✅ Bon - descriptif
const userAge = 25;
const productPrice = 99.99;
const isEmailVerified = true;

// ❌ Mauvais - trop court, pas clair
const a = 25;
const p = 99.99;
const v = true;

Pour aller plus loin

Pour en savoir plus sur les conventions de nommage (camelCase, PascalCase, snake_case, kebab-case), consultez l'Annexe Conventions de nommage.

Quelle est la bonne convention pour nommer une variable contenant le nombre d'utilisateurs actifs ?

Règle d'or

Bonne pratique

  1. Toujours utiliser const par défaut
  2. Passer à let seulement si vous devez réassigner
  3. Ne jamais utiliser var (code obsolète)
javascript
// ✅ Bon
const name = 'Alice';
let score = 0;
score = score + 10;

// ❌ Mauvais
var name = 'Alice'; // OBSOLÈTE
var score = 0;