JavaScript moderne
Les nouveaux pouvoirs du héros JavaScript (ES6+).
Imagine : tu viens de looter un nouveau set légendaire. Grâce à cette version moderne de JavaScript, tu réduis le bruit dans ton code, tu frappes plus fort avec moins de lignes, et tu évites les pièges du passé. Ton build devient plus agile, plus lisible, plus redoutable.
9.1let & const (au lieu de var)
let et const sont les nouvelles façons de déclarer des variables. Elles sont plus sûres que var, qu’on évite désormais (sauf cas très particuliers).
const : la valeur ne change jamais (comme un pouvoir permanent)
let : la valeur peut évoluer (comme un score ou une position)
const PI = 3.14; // constante
let score = 0; // variable évolutive9.2Fonctions fléchées
Plus rapides à écrire, parfaites pour les fonctions simples ou anonymes. Elles gardent aussi le contexte de this (utile dans certains cas).
// Version longue
function saluer(nom) {
return "Bonjour " + nom;
}
// Version moderne
const saluer = (nom) => "Bonjour " + nom;9.3Template literals (chaînes avec ${})
On peut écrire des chaînes de caractères plus lisibles, avec des retours à la ligne et des variables intégrées facilement :
let nom = "Alice";
let message = `Bonjour ${nom},
Bienvenue sur le site !`;9.4Déstructuration
Tu peux extraire des valeurs d’un tableau ou d’un objet directement, sans les répéter une par une :
let [a, b] = [1, 2];
let joueur = { nom: "Léo", niveau: 10 };
let { nom, niveau } = joueur;9.5Valeurs par défaut
Tu peux attribuer une valeur de secours à un paramètre, au cas où rien n’est transmis :
function saluer(nom = "visiteur") {
console.log("Bonjour " + nom);
}9.6Opérateur de propagation (...) spread
Il te permet de copier ou fusionner facilement des tableaux ou objets (très utile pour ne pas modifier l’original sans faire exprès).
let notes = [10, 15];
let toutes = [...notes, 20]; // [10, 15, 20]
let base = { a: 1 };
let copie = { ...base, b: 2 };9.7includes(), startsWith(), endsWith()
Des méthodes modernes pour vérifier si une chaîne ou un tableau contient un élément (ou commence/finit par quelque chose) :
"javascript".includes("script"); // true
[1, 2, 3].includes(2); // true
"Hello".startsWith("H"); // true
"fichier.txt".endsWith(".txt"); // true9.8Promesses simplifiées avec async/await
Plutôt que d’enchaîner les .then(), tu peux rendre ton code asynchrone bien plus lisible avec async et await :
async function fetchData() {
let response = await fetch("https://api.exemple.com");
let data = await response.json();
console.log(data);
}9.9Nullish coalescing (??)
Cet opérateur ?? renvoie une valeur par défaut uniquement si la première est null ou undefined.
Idéal pour éviter les "undefined" sans écraser les zéros ou chaînes vides.
let nom = null;
let affichage = nom ?? "inconnu"; // "inconnu"9.10Optional chaining (?.)
Tu peux accéder à une propriété sans que ça plante si elle n’existe pas. JS retourne undefined au lieu d’une erreur fatale.
let utilisateur = {};
console.log(utilisateur.profil?.nom); // undefined (pas d'erreur)9.11Bonus : astuces de maître
Quelques autres raccourcis et outils que tu peux croiser au fil du jeu. Pas obligatoires pour commencer, mais utiles à connaître quand tu montes en niveau :
Object.entries(obj)– transforme un objet en tableau de paires [clé, valeur]Array.flat()– aplatit un tableau contenant d’autres tableaux?.et??– déjà vus, mais combinables avec d’autres syntaxes modernes??=– assigne une valeur uniquement si la variable estnullouundefined:
joueur.nom ??= "Inconnu";?.()– appelle une fonction seulement si elle existe :
joueur.attaquer?.();Comme dans tout bon jeu, plus tu avances, plus tu croises de petits outils cachés. Pas besoin de tout retenir maintenant : reviens-y quand tu seras prêt à affûter ton gameplay.