HTML CSS JS

JavaScript est le seul langage de programmation qui fonctionne nativement dans les navigateurs. C'est lui qui rend les pages web interactives : menus qui s'ouvrent, formulaires qui se valident, contenu qui se charge dynamiquement.

HTML structure, CSS embellit, JavaScript fait vivre.

Variables — stocker des valeurs

JavaScript a 3 mots-clés pour déclarer des variables. En 2026, vous n'en utilisez que 2 :

• const — une constante (la valeur ne change pas). Votre choix par défaut.
• let — une variable qui peut changer. Uniquement quand la valeur doit réellement changer (compteur, état toggle).
• var — l'ancienne syntaxe. Ne l'utilisez JAMAIS — elle a des problèmes de portée qui causent des bugs.

Règle : écrivez const partout. Si la valeur doit changer, passez à let. N'écrivez jamais var.

Types de données

String — texte entre guillemets : "Bonjour" ou 'Hello' ou avec des backticks.

Number — nombres entiers et décimaux : 42, 3.14, -7.

Boolean — vrai ou faux : true, false.

Array — liste ordonnée : [1, 2, 3], ["HTML", "CSS", "JS"]. Commence à l'index 0.

Object — données structurées en paires clé: valeur : { name: "Ali", age: 25 }.

null — absence intentionnelle de valeur ("je sais qu'il n'y a rien").

undefined — variable déclarée mais pas encore assignée.

Template literals (backticks)

Au lieu de concaténer des strings avec + (pénible), utilisez les backticks avec ${}:

const name = "Fatou"; const msg = `Bonjour ${name} !`; // "Bonjour Fatou !"

Les backticks supportent aussi les retours à la ligne et les expressions JavaScript à l'intérieur de ${}.

Fonctions fléchées (arrow functions)

La syntaxe moderne pour les fonctions :

const greet = (name) => { return `Bonjour ${name}`; };

Version courte pour une seule expression (pas besoin de {} ni return) :

const double = (n) => n * 2;

Conditions

if (age >= 18) { console.log("Majeur"); } else { console.log("Mineur"); }

L'opérateur ternaire pour les cas simples : const status = age >= 18 ? "majeur" : "mineur";

Méthodes de tableau

Les tableaux ont des méthodes puissantes pour manipuler les données sans boucles for classiques :

• .forEach() — exécuter quelque chose pour chaque élément
• .map() — transformer chaque élément (retourne un NOUVEAU tableau)
• .filter() — garder seulement les éléments qui passent un test
• .find() — trouver le PREMIER élément qui passe un test
• .includes() — vérifier si un élément existe (retourne true/false)
• .length — le nombre d'éléments

> Bonne pratique : préférez .map(), .filter(), .find() aux boucles for. Elles sont plus lisibles et expriment clairement l'intention.

Objets — données structurées

Un objet est un ensemble de paires clé: valeur, comme une fiche d'identité :

const profile = { name: "Moussa", role: "Dev Web", city: "Dakar", skills: ["HTML", "CSS", "JS"] };

On accède aux propriétés avec le point : profile.name donne "Moussa". profile.skills[0] donne "HTML".