JavaScript ES6+ : les fondamentaux
⏱ 60 minJavaScript est le seul langage natif du navigateur. Avec Node.js, il s'étend au backend. ES6+ (2015 et après) l'a rendu moderne et élégant.
Variables modernes
const nom = "Emile"; // constante (recommandé par défaut)
let score = 0; // variable modifiable
// var : éviter — portée ambiguë
// Destructuring
const { prenom, age } = utilisateur;
const [premier, ...reste] = tableau;
// Template literals
const message = `Bonjour ${nom}, tu as ${age} ans`;
Fonctions modernes
// Arrow function
const carre = x => x ** 2;
const additionner = (a, b) => a + b;
// Paramètres par défaut
const saluer = (nom = "visiteur") => `Bonjour ${nom}`;
// Spread & rest
const fusion = [...tableau1, ...tableau2];
const somme = (...nombres) => nombres.reduce((a, b) => a + b, 0);
Tableaux modernes — les méthodes fonctionnelles :
const modules = ["Python", "ML", "Deep Learning", "NLP"];
modules.map(m => m.toUpperCase()) // transformer
modules.filter(m => m.length > 5) // filtrer
modules.find(m => m.startsWith("ML")) // trouver
modules.reduce((acc, m) => acc + 1, 0) // agréger
modules.sort() // trier
Modules ES6
// curriculum.js
export const MODULES = ["Python", "ML"];
export function getModule(id) { ... }
// main.js
import { MODULES, getModule } from "./curriculum.js";
Ressource : javascript.info — https://javascript.info (le meilleur tutoriel JS gratuit)
✍️ Exercices de la leçon
2 exercicesFais-les dans l'ordre, dans un vrai fichier .py — pas dans ta tête. Ne déplie la correction qu'après avoir écrit quelque chose, même faux.
Exercice A — Chaîner map, filter et reduce
Application directe · Tu appliques ce que tu viens de lire.
const modules = [
{ id: "py", titre: "Python", heures: 12, niveau: "debutant", fait: true },
{ id: "ml", titre: "ML classique", heures: 20, niveau: "intermediaire", fait: false },
{ id: "dl", titre: "Deep Learning", heures: 18, niveau: "intermediaire", fait: false },
{ id: "nlp", titre: "NLP", heures: 16, niveau: "avance", fait: true },
{ id: "ops", titre: "MLOps", heures: 14, niveau: "avance", fait: false },
];
Sans écrire une seule boucle for, produis :
- 1.la liste des titres en majuscules
- 2.les modules de niveau avancé non terminés
- 3.le total d'heures restantes (modules non faits)
- 4.un objet
{ debutant: 1, intermediaire: 2, avance: 2 }comptant les modules par niveau - 5.le module le plus long
Puis écris le point 3 en une seule chaîne de méthodes.
Exercice B — Quand la chaîne fonctionnelle est un mauvais choix
Page blanche · Aucun squelette : à toi de choisir la méthode.
Page blanche. Refactoring et jugement.
function analyser(transactions) {
const resultat = {};
for (let i = 0; i < transactions.length; i++) {
const t = transactions[i];
if (t.statut !== "validee") continue;
if (!resultat[t.client]) {
resultat[t.client] = { total: 0, nb: 0 };
}
resultat[t.client].total += t.montant;
resultat[t.client].nb += 1;
}
for (const client in resultat) {
resultat[client].moyenne = resultat[client].total / resultat[client].nb;
}
return resultat;
}
- 1.réécris cette fonction en style fonctionnel
- 2.compare les deux versions sur trois critères : lisibilité, performance, débogabilité
- 3.trouve un cas où tu garderais la boucle `for` — il en existe plusieurs, cite-en deux avec un argument précis
- 4.mesure les deux versions sur 1 million de transactions
Le point 3 est le vrai exercice. « Le fonctionnel c'est mieux » est un slogan, pas un raisonnement.