a · Le JavaScript moderne utile au backend

Le JavaScript a beaucoup changé depuis ses débuts. Cette section couvre la syntaxe que tu croiseras dans tout le reste du cours — pas tout le langage, juste ce qui sert à écrire un backend clair.

const et let

Oublie var : il pose des problèmes de portée que const et let évitent. Utilise const par défaut, et let seulement si la variable doit changer de valeur.

const nom = 'Lune Rousse'; // ne sera jamais réassignée
let tour = 1; // va être incrémentée
tour = tour + 1;

Les fonctions fléchées

Une fonction fléchée (arrow function) s’écrit plus court qu’une fonction classique, surtout pour de petites fonctions passées en argument.

// Fonction classique
function estUnLoup(joueur) {
  return joueur.role === 'loup-garou';
}

// Fonction fléchée équivalente
const estUnLoup = (joueur) => joueur.role === 'loup-garou';

Avec un seul argument et une seule expression retournée, tu peux omettre les parenthèses et le return. C’est pratique avec des méthodes comme .filter() ou .map() :

const joueurs = [
  { pseudo: 'Clémence', role: 'loup-garou' },
  { pseudo: 'Yanis', role: null },
  { pseudo: 'Oscar', role: 'loup-garou' },
];

const loups = joueurs.filter((j) => j.role === 'loup-garou');
const pseudos = joueurs.map((j) => j.pseudo);

La déstructuration

Extraire des champs d’un objet, ou des éléments d’un tableau, sans écrire objet.champ à chaque fois :

const village = { nom: 'Lune Rousse', joueurs: ['Clémence', 'Yanis', 'Maëlle'] };
const { nom, joueurs } = village;

const [premier, deuxieme] = joueurs;

Tu peux renommer un champ pendant la déstructuration, avec { joueurs: liste } par exemple — utile si le nom joueurs est déjà pris ailleurs dans ta fonction.

Tu peux aussi donner une valeur par défaut, utile pour un champ optionnel :

function presenter({ pseudo, role = 'rôle inconnu' }) {
  return `${pseudo} (${role})`;
}

Remarque au passage les template literals, entre backticks, qui insèrent des valeurs avec ${...} — plus lisibles que la concaténation avec +.

Spread et modules

Le spread (...) copie le contenu d’un objet ou d’un tableau dans un autre. C’est la façon idiomatique de modifier une valeur sans la muter :

const optionsParDefaut = { phase: 'jour', tour: 1 };
const partieEnCours = { ...optionsParDefaut, tour: 3 };
// { phase: 'jour', tour: 3 }

Enfin, ton code sera réparti en plusieurs fichiers, reliés par import et export :

villages.mjs

export function creerVillage(nom) {
  return { nom, joueurs: [] };
}

main.mjs

import { creerVillage } from './villages.mjs';

const village = creerVillage('Lune Rousse');

L’extension .mjs dit explicitement à Node que ce fichier utilise import/export — avec une simple extension .js, tu obtiendrais l’erreur Cannot use import statement outside a module.

Exercises 1.1 to 1.3

1.1: Refactoriser vers le JavaScript moderne

Reprends cette fonction et réécris-la avec const, une fonction fléchée, la déstructuration et un template literal :

function decrire(joueur) {
  var pseudo = joueur.pseudo;
  var role = joueur.role;
  return pseudo + ' est ' + (role || 'un rôle encore inconnu');
}

1.2: Un petit module

Crée deux fichiers .mjs. Dans village.mjs, exporte une fonction ajouterJoueur(village, pseudo) qui renvoie un nouveau village avec le joueur ajouté, sans modifier l’original (utilise le spread sur le tableau joueurs). Dans main.mjs, importe cette fonction et vérifie avec console.log que le village d’origine n’a pas changé.

1.3: Rest et paramètre par défaut

Écris une fonction compterVotes(cible = 'personne', ...votes) : cible est un pseudo avec une valeur par défaut, et ...votes récupère tous les arguments suivants dans un tableau (le rest). Elle renvoie le nombre de fois où cible apparaît dans votes. Vérifie que compterVotes(), appelée sans argument, ne plante pas.