Exploiter la référence MDN (Mozilla) JavaScript

Anatomie d'une page de référence

Exemple : lire la page de String.prototype.padStart()

• Syntaxe: padStart(longueurCible) et padStart(longueurCible, chaineComplement).
• Paramètres: longueurCible est la longueur finale souhaitée ; chaineComplement (facultatif) est le texte ajouté au début (un espace par défaut).
• Valeur de retour: une nouvelle chaîne ; la chaîne d'origine n'est pas modifiée.
• On peut donc écrire, en toute confiance :

const numero = "7";
console.log(numero.padStart(3, "0")); // "007"
console.log(numero.padStart(3));      // "  7"
console.log(numero);                  // "7" : la chaîne d'origine est inchangée

6. Rechercher efficacement

   • Sur le site, la touche / place le curseur dans la barre de recherche.
   • Avec un moteur de recherche, ajoutez « mdn » à la requête : mdn array map, mdn queryselector. Le premier résultat est presque toujours la bonne page.
   • Utilisez le nom anglais de la notion (les noms des méthodes sont toujours en anglais).
   • Pour un message d'erreur de la console, recherchez le message tel quel : mdn « is not a function ».
   • Le MDN Playground (developer.mozilla.org/play) permet de tester du HTML, du CSS et du JavaScript en ligne, sans rien installer.

7. Les autres sources… et leurs limites

   • Spécification ECMAScript (tc39.es/ecma262) : le texte officiel, très précis mais difficile à lire. MDN en est la version accessible.
   • caniuse.com: la compatibilité des fonctionnalités, présentée autrement.
   • Forums et tutoriels (Stack Overflow, blogs, vidéos) : utiles, mais parfois anciens. Vérifiez toujours la date et comparez avec MDN.
   • Assistants d'intelligence artificielle: ils peuvent se tromper ou inventer une méthode qui n'existe pas. Toute réponse doit être vérifiée sur MDN et testée.

8. Activités

Activité 1 : chasse au trésor sur MDN

• Pour chaque méthode, notez sa syntaxe, ce qu'elle renvoie, si elle modifie l'original et son statut Baseline: Array.prototype.includes(), String.prototype.toUpperCase(), Math.round(), Array.prototype.sort(), Array.prototype.toSorted().
• Présentez les résultats dans un tableau dans le README.md de votre dépôt js-mdn.

Activité 2 : lire puis prédire

• Sans exécuter, en vous aidant seulement de MDN, prédisez le résultat de chaque ligne, puis vérifiez dans la console :

console.log("Bootstrap".slice(0, 4));
console.log([3, 1, 2].includes("2"));
console.log(Math.max());
console.log("a-b-c".split("-"));
console.log([10, 9, 1].sort());

Activité 3 : comprendre un message d'erreur

• Exécutez null.length puis maVariable + 1 dans la console. Recherchez chaque message dans la page « Erreurs JavaScript » de MDN et expliquez la cause avec vos mots.

Activité 4 : français ou anglais ?

• Ouvrez la page de Object.groupBy() en français, puis en anglais. Les deux pages ont-elles le même contenu ? Laquelle a été mise à jour le plus récemment (date en bas de page) ?

À retenir

• MDN est la documentation de référence du Web ; la version anglaise fait foi.
• Le Guide sert à apprendre, la Référence sert à vérifier.
• Une page de référence se lit dans l'ordre : syntaxe, paramètres, valeur de retour, exemples, compatibilité.
• Toute information trouvée ailleurs (forum, IA) se vérifie sur MDN et se teste dans la console.

Sources : MDN Web Docs (developer.mozilla.org), documentation de Visual Studio Code et des Chrome DevTools.