211 entrées · 10 catégories
Documentation JavaScript
La syntaxe du langage, les classes, les méthodes des tableaux, des chaînes et des objets, les promesses, le DOM et les API du navigateur. Chaque exemple se lance en un clic et, après modification, vous voyez le nouveau résultat dans la console.
211 entrées
Syntaxe et instructions
Variables, conditions, boucles, fonctions, classes et opérateurs.
- letDéclare une variable à portée de bloc, dont la valeur peut être modifiée plus tard.
- constDéclare une constante à portée de bloc. Une telle variable ne peut pas recevoir une nouvelle valeur.
- varDéclare une variable à portée de fonction. C’est l’ancienne façon, remplacée aujourd’hui par let et const.
- functionDéclare une fonction nommée : un bloc de code avec des paramètres, que vous pouvez appeler autant de fois que vous voulez et qui peut renvoyer un résultat.
- () => {}Fonction fléchée (arrow function) : une syntaxe de fonction plus courte, sans this propre, avec un return implicite pour une seule expression.
- Paramètres par défautLes valeurs qu’un paramètre de fonction reçoit quand l’argument n’est pas fourni ou vaut undefined.
- Paramètre du reste (...rest)Rassemble tous les arguments restants d’une fonction dans un véritable tableau. Vous l’écrivez comme ...nom à la fin de la liste.
- function*Déclare un générateur : une fonction qui livre des valeurs successives via yield et se met en pause entre elles.
- Itérateurs (Symbol.iterator)Le protocole d’itération : un objet avec une méthode [Symbol.iterator]() fonctionne avec for...of, le spread et la déstructuration.
- if...elseExécute un bloc de code seulement si une condition est vraie, et sinon un bloc else optionnel.
- switchCompare une valeur à une liste de cas case et exécute le code à partir du premier qui correspond.
- forUne boucle avec compteur : initialisation, condition et étape. Répète un bloc de code tant que la condition est vraie.
- for...ofParcourt les valeurs successives d’un objet itérable : tableau, chaîne, Map, Set et autres.
- for...inParcourt les noms des propriétés énumérables d’un objet, y compris celles héritées du prototype.
- whileRépète un bloc de code tant que la condition est vraie. La condition est vérifiée avant chaque tour.
- do...whileExécute un bloc de code au moins une fois, puis le répète tant que la condition est vraie.
- breakTermine immédiatement une boucle ou une instruction switch et passe au code qui la suit.
- continueIgnore le reste du tour de boucle actuel et passe immédiatement au suivant.
- returnTermine l’exécution d’une fonction et transmet une valeur à l’endroit où la fonction a été appelée.
- try...catchCapture les erreurs levées dans un bloc try et les traite dans catch. Un finally optionnel s’exécute toujours.
- throwLève une exception : interrompt le code en cours et transmet l’erreur au bloc catch le plus proche.
- ErrorUn objet d’erreur intégré avec un message et une pile d’appels. La base des exceptions et des classes d’erreurs personnalisées.
- classDéfinit une classe, c’est-à-dire un modèle pour créer des objets avec les mêmes champs et méthodes.
- importCharge les valeurs exportées par un autre module ES : fonctions, classes, constantes ou tout le module.
- exportRend disponibles des fonctions, des classes et des valeurs depuis un module, pour que d’autres fichiers puissent les importer.
- typeofRenvoie une chaîne avec le nom du type d’une valeur, par ex. "number", "string" ou "object".
- ? :L’opérateur conditionnel (ternaire) renvoie l’une de deux valeurs selon une condition, en une seule expression courte.
- Spread (...)La syntaxe spread décompose un tableau, une chaîne ou un objet en éléments individuels : pour copier, fusionner et passer des arguments.
- DéstructurationLa déstructuration (destructuring) extrait des valeurs de tableaux et d’objets directement vers des variables séparées.
- ?.L’opérateur ?. (optional chaining) lit une propriété de façon sûre. Quand l’objet est null ou undefined, il renvoie undefined au lieu d’une erreur.
- ??L’opérateur ?? (nullish coalescing) renvoie le côté droit seulement quand le côté gauche est null ou undefined. Idéal pour les valeurs par défaut.
- Template literalsDes templates de texte entre guillemets inversés : ils insèrent des valeurs via ${} et peuvent s’étendre sur plusieurs lignes.
- ===L’opérateur d’égalité stricte compare des valeurs sans conversion de types : true n’est obtenu que pour le même type et la même valeur.
- &&, ||, !Les opérateurs logiques ET (&&), OU (||) et NON (!). Ils combinent des conditions, et && et || renvoient l’un de leurs côtés.
Tableaux
Les méthodes de l’objet Array : transformer, filtrer, rechercher et trier.
- Array.prototype.map()Crée un nouveau tableau avec les résultats de l’appel d’une fonction pour chaque élément.
- Array.prototype.filter()Crée un nouveau tableau avec les éléments pour lesquels la fonction a renvoyé true.
- Array.prototype.reduce()Réduit tout le tableau à une seule valeur, par exemple une somme, un objet ou un nouveau tableau.
- Array.prototype.forEach()Appelle une fonction pour chaque élément du tableau.
- Array.prototype.find()Renvoie le premier élément qui remplit la condition, ou undefined.
- Array.prototype.findIndex()Renvoie l’indice du premier élément qui remplit la condition, ou -1.
- Array.prototype.findLast()Renvoie le dernier élément qui remplit la condition, en parcourant le tableau depuis la fin.
- Array.prototype.findLastIndex()Renvoie l’indice du dernier élément qui remplit la condition, en cherchant depuis la fin, ou -1.
- Array.prototype.some()Vérifie si au moins un élément remplit la condition.
- Array.prototype.every()Vérifie si tous les éléments remplissent la condition.
- Array.prototype.includes()Vérifie si un tableau contient la valeur donnée.
- Array.prototype.indexOf()Renvoie l’indice de la première occurrence d’une valeur, ou -1.
- Array.prototype.lastIndexOf()Renvoie l’indice de la dernière occurrence d’une valeur dans le tableau, ou -1 si elle n’y est pas.
- Array.prototype.push()Ajoute des éléments à la fin du tableau et renvoie sa nouvelle longueur.
- Array.prototype.pop()Supprime le dernier élément du tableau et le renvoie.
- Array.prototype.shift()Supprime le premier élément du tableau et le renvoie.
- Array.prototype.unshift()Ajoute des éléments au début du tableau et renvoie sa nouvelle longueur.
- Array.prototype.slice()Renvoie une copie d’une portion du tableau, sans modifier l’original.
- Array.prototype.splice()Supprime, remplace ou insère des éléments sur place, en modifiant le tableau.
- Array.prototype.toSpliced()Supprime, insère ou remplace des éléments dans une copie du tableau. L’original reste inchangé.
- Array.prototype.sort()Trie les éléments du tableau sur place et renvoie ce même tableau.
- Array.prototype.toSorted()Renvoie une copie triée du tableau, sans modifier l’original.
- Array.prototype.reverse()Inverse l’ordre des éléments du tableau sur place.
- Array.prototype.toReversed()Renvoie un nouveau tableau avec les éléments dans l’ordre inverse, sans modifier l’original.
- Array.prototype.concat()Combine des tableaux et des valeurs en un nouveau tableau.
- Array.prototype.join()Assemble les éléments du tableau en une seule chaîne avec le séparateur choisi.
- Array.prototype.flat()Aplatit des tableaux imbriqués jusqu’à la profondeur indiquée.
- Array.prototype.flatMap()Mappe chaque élément et aplatit le résultat d’un niveau.
- Array.prototype.at()Renvoie l’élément à l’indice donné, y compris compté depuis la fin.
- Array.prototype.with()Renvoie une copie du tableau dans laquelle l’élément à l’indice donné a une nouvelle valeur.
- Array.from()Crée un tableau à partir d’un objet itérable ou « semblable à un tableau ».
- Array.of()Crée un nouveau tableau à partir des arguments donnés, quel que soit leur nombre ou leur type.
- Array.isArray()Vérifie si une valeur est un tableau.
- Array.prototype.fill()Remplit un tableau (ou une partie de celui-ci) avec une seule valeur.
- Array.prototype.lengthLe nombre d’éléments du tableau, qui peut aussi être modifié.
Chaînes de caractères
Les méthodes de l’objet String : extraire, remplacer, découper et formater du texte.
- String.prototype.lengthLa longueur d’une chaîne, c’est-à-dire le nombre d’unités de code UTF-16. La propriété est en lecture seule.
- String.prototype.slice()Renvoie un fragment de la chaîne entre un indice de départ et un indice de fin (exclu). Prend en charge les indices négatifs.
- String.prototype.substring()Renvoie un fragment de la chaîne entre deux indices. Convertit les valeurs négatives en 0 et échange les indices inversés.
- String.prototype.split()Découpe une chaîne en un tableau de fragments selon un séparateur : un caractère, un texte ou une expression régulière.
- String.prototype.replace()Renvoie une nouvelle chaîne dans laquelle la première occurrence d’un motif (ou toutes, avec le flag g) a été remplacée par un autre texte.
- String.prototype.replaceAll()Renvoie une nouvelle chaîne dans laquelle toutes les occurrences d’un motif ont été remplacées par le texte donné ou le résultat d’une fonction.
- String.prototype.toUpperCase()Renvoie une copie de la chaîne convertie en majuscules. Gère correctement les lettres accentuées.
- String.prototype.toLowerCase()Renvoie une copie de la chaîne convertie en minuscules. Utile pour les comparaisons et la normalisation des données.
- String.prototype.trim()Supprime les espaces blancs aux deux extrémités de la chaîne : espaces, tabulations et retours à la ligne.
- String.prototype.trimStart()Supprime les espaces blancs uniquement au début de la chaîne. La fin du texte reste inchangée.
- String.prototype.trimEnd()Supprime les espaces blancs uniquement à la fin de la chaîne, y compris les retours à la ligne finaux.
- String.prototype.includes()Vérifie si une chaîne contient le fragment de texte donné. Renvoie true ou false et distingue majuscules et minuscules.
- String.prototype.startsWith()Vérifie si une chaîne commence par le texte donné. Renvoie true ou false.
- String.prototype.endsWith()Vérifie si une chaîne se termine par le texte donné. Renvoie true ou false.
- String.prototype.indexOf()Renvoie l’indice de la première occurrence du texte donné dans une chaîne, ou -1 s’il est absent.
- String.prototype.lastIndexOf()Renvoie l’indice de la dernière occurrence du texte donné dans une chaîne, ou -1 s’il est absent.
- String.prototype.padStart()Complète une chaîne à gauche avec le texte donné jusqu’à ce qu’elle atteigne la longueur indiquée. Idéal pour les zéros initiaux.
- String.prototype.padEnd()Complète une chaîne à droite avec le texte donné jusqu’à ce qu’elle atteigne la longueur indiquée.
- String.prototype.repeat()Renvoie une nouvelle chaîne composée du nombre indiqué de répétitions de l’original.
- String.prototype.at()Renvoie le caractère à l’indice donné. Les indices négatifs se comptent depuis la fin, donc at(-1) est le dernier caractère.
- String.prototype.charAt()Renvoie le caractère à l’indice donné. Hors de la plage valide, elle renvoie une chaîne vide au lieu de undefined.
- String.prototype.match()Fait correspondre une chaîne à une expression régulière. Renvoie un tableau avec la correspondance, toutes les correspondances, ou null.
- String.prototype.matchAll()Renvoie un itérateur sur toutes les correspondances d’une expression régulière, chacune avec ses groupes et sa position dans le texte.
- String.prototype.search()Renvoie l’indice de la première correspondance d’une expression régulière dans une chaîne, ou -1.
- String.prototype.localeCompare()Compare deux chaînes selon les règles d’une langue. Renvoie un nombre négatif, zéro ou un nombre positif, idéal pour trier.
Objets et classes
Les méthodes de l’objet Object, les classes, l’héritage, les getters et les prototypes.
- Object.keys()Renvoie un tableau des noms des propriétés propres et énumérables d’un objet.
- Object.values()Renvoie un tableau des valeurs propres et énumérables d’un objet.
- Object.entries()Renvoie un tableau des paires [clé, valeur] d’un objet.
- Object.assign()Copie les propriétés d’un ou plusieurs objets vers un objet cible.
- Object.freeze()Gèle un objet, en bloquant l’ajout, la suppression et la modification de ses propriétés.
- Object.fromEntries()Crée un objet à partir d’une liste de paires [clé, valeur].
- Object.hasOwn()Vérifie si un objet a sa propre propriété portant le nom donné.
- Object.is()Vérifie si deux valeurs sont identiques. Elle ne diffère de === que pour NaN, ainsi que pour 0 et -0.
- Object.groupBy()Regroupe des éléments selon une clé renvoyée par une fonction.
- Object.create()Crée un nouvel objet avec le prototype donné.
- thisMot-clé qui désigne l’objet sur lequel une fonction a été appelée.
- get / setPropriétés calculées à la lecture (get) et gérées à l’écriture (set).
- extendsCrée une classe dérivée qui hérite des méthodes d’une autre classe et peut les étendre ou les redéfinir.
- superFait référence à la classe de base : appelle son constructeur ou sa version d’une méthode.
- staticMarque un champ ou une méthode comme appartenant à la classe elle-même, et non aux objets créés avec new.
- #champLes champs et méthodes préfixés par # sont privés : seul le code à l’intérieur de la classe peut y accéder.
- instanceofVérifie si un objet a été créé par une classe donnée, ou par une classe qui en hérite.
Nombres et Math
Conversions, arrondis, nombres aléatoires et fonctions mathématiques.
- Number.parseInt()Convertit le début d’une chaîne de caractères en nombre entier dans la base choisie.
- Number.parseFloat()Convertit le début d’une chaîne de caractères en nombre à virgule flottante.
- Number.prototype.toFixed()Convertit un nombre en chaîne de caractères avec un nombre donné de décimales.
- Number.prototype.toString()Convertit un nombre en chaîne de caractères, y compris dans un autre système de numération, comme le binaire ou l’hexadécimal.
- Number.prototype.toLocaleString()Formate un nombre selon les habitudes de la langue choisie : séparateurs de milliers, virgule, devises et pourcentages.
- Number.isNaN()Vérifie si une valeur est exactement NaN.
- Number.isInteger()Vérifie si une valeur est un nombre entier.
- Number.isFinite()Vérifie si une valeur est un nombre ordinaire et fini, ni NaN ni infini.
- BigIntUn type pour des calculs exacts sur des nombres entiers de taille arbitraire. Les littéraux se terminent par la lettre n.
- Math.round()Arrondit un nombre à l’entier le plus proche.
- Math.floor()Arrondit un nombre vers le bas, à l’entier inférieur le plus proche.
- Math.ceil()Arrondit un nombre vers le haut, à l’entier supérieur le plus proche.
- Math.random()Renvoie un nombre aléatoire de 0 (inclus) à 1 (exclu).
- Math.max()Renvoie le plus grand des nombres donnés.
- Math.min()Renvoie le plus petit des nombres donnés.
- Math.abs()Renvoie la valeur absolue d’un nombre, c’est-à-dire sa distance à zéro.
- Math.pow()Élève un nombre à une puissance.
- Math.sqrt()Renvoie la racine carrée d’un nombre.
- Math.trunc()Coupe la partie décimale d’un nombre, en ne laissant que la partie entière.
Code asynchrone
Promesses, async/await, minuteurs et requêtes fetch.
- PromiseUn objet qui représente le résultat d’une opération disponible plus tard : une valeur en cas de succès, ou une erreur.
- Promise.prototype.then()Enregistre une fonction appelée quand la promesse est résolue, et renvoie une nouvelle promesse, ce qui permet d’enchaîner les étapes.
- Promise.prototype.catch()Enregistre une fonction de gestion d’erreur, appelée quand la promesse est rejetée.
- Promise.prototype.finally()Enregistre une fonction appelée une fois la promesse réglée, qu’elle se termine par un succès ou par une erreur.
- Promise.all()Attend que toutes les promesses soient résolues et renvoie un tableau de leurs résultats. Se rejette dès la première erreur.
- Promise.allSettled()Attend que toutes les promesses soient réglées et renvoie une description de chaque résultat, succès comme erreurs.
- Promise.race()Renvoie une promesse qui se règle de la même façon que la première promesse réglée de la liste : par un succès ou par une erreur.
- Promise.any()Renvoie le résultat de la première promesse résolue. Ne se rejette que si toutes échouent.
- async functionDéclare une fonction asynchrone, qui renvoie toujours une promesse et peut utiliser le mot-clé await à l’intérieur.
- awaitMet en pause une fonction async jusqu’au règlement d’une promesse, puis renvoie sa valeur ou lève son erreur.
- setTimeout()Exécute une fonction une seule fois, après le nombre de millisecondes indiqué.
- setInterval()Appelle une fonction de façon répétée, à l’intervalle donné, jusqu’à l’arrêt par clearInterval().
- fetch()Envoie une requête HTTP et renvoie une promesse avec la réponse du serveur (un objet Response).
Objets intégrés
Map, Set, JSON, Date, Intl, RegExp et les autres objets intégrés au langage.
- MapUne collection de paires clé-valeur dans laquelle la clé peut être n’importe quelle valeur, et où l’ordre d’ajout est conservé.
- SetUne collection de valeurs uniques : chaque valeur ne peut apparaître qu’une fois dans l’ensemble.
- WeakMapUne map avec des objets comme clés, qui ne les retient pas en mémoire : l’entrée disparaît avec l’objet inutilisé.
- WeakSetUn ensemble d’objets qui ne les retient pas en mémoire. Sert à marquer des objets, par ex. déjà traités.
- JSON.stringify()Transforme une valeur JavaScript, comme un objet ou un tableau, en chaîne de caractères au format JSON.
- JSON.parse()Transforme une chaîne de caractères au format JSON en valeur JavaScript, comme un objet ou un tableau.
- structuredClone()Crée une copie profonde d’une valeur, y compris les objets imbriqués, les dates, les Map et les Set.
- DateUn objet représentant un instant précis, avec des méthodes pour lire et modifier la date et l’heure.
- Intl.NumberFormatFormate des nombres selon les règles d’une langue donnée : séparateurs, devises, pourcentages et unités.
- Intl.DateTimeFormatFormate les dates et les heures selon les règles d’une langue et d’un fuseau horaire choisis.
- Intl.RelativeTimeFormatFormate un temps relatif dans la langue choisie, par ex. « dans 3 jours », « il y a 2 heures » ou « hier ».
- Intl.PluralRulesChoisit la bonne forme grammaticale d’un mot selon un nombre, dans la langue choisie. En français : 0 leçon, 1 leçon, 2 leçons.
- RegExpUne expression régulière : un modèle pour rechercher, valider et remplacer des fragments de texte.
- SymbolUn type primitif pour créer des identifiants uniques, par ex. des clés de propriété qui n’entrent jamais en collision avec d’autres.
DOM et événements
Trouver et créer des éléments, gérer les événements, les classes, les attributs et le contenu.
- document.querySelector()Renvoie le premier élément qui correspond à un sélecteur CSS, ou null si rien ne correspond.
- document.querySelectorAll()Renvoie une liste statique (NodeList) de tous les éléments qui correspondent à un sélecteur CSS.
- document.getElementById()Renvoie l’élément portant l’identifiant donné (l’attribut id), ou null s’il n’existe pas.
- EventTarget.addEventListener()Enregistre une fonction appelée à chaque fois qu’un événement se produit sur un élément, par ex. un clic.
- Element.classListUn objet pour ajouter, retirer, basculer et vérifier les classes CSS d’un élément.
- Node.textContentLit ou définit tout le texte d’un élément, sans les balises HTML.
- Element.innerHTMLLit ou remplace le contenu d’un élément sous forme de code HTML.
- document.createElement()Crée un nouvel élément HTML avec le nom de balise donné, prêt à être inséré dans la page.
- Element.append()Ajoute des éléments ou du texte à la fin du contenu d’un élément.
- Element.remove()Supprime un élément du document avec tout son contenu.
- Element.setAttribute()Définit la valeur d’un attribut HTML d’un élément, ou en ajoute un nouveau.
- HTMLElement.datasetUn objet avec les valeurs des attributs data-* d’un élément, pour lire et écrire vos propres données.
- HTMLElement.styleUn objet pour les styles écrits directement sur l’élément (inline), pour lire et modifier des propriétés CSS individuelles.
- Event.preventDefault()Bloque l’action par défaut du navigateur pour un événement, par ex. l’envoi d’un formulaire ou le suivi d’un lien.
- Event.targetL’élément sur lequel l’événement s’est réellement produit, par ex. le bouton cliqué à l’intérieur d’une liste.
- Element.closest()Renvoie l’ancêtre le plus proche (ou l’élément lui-même) qui correspond à un sélecteur CSS, ou null.
- Element.insertAdjacentHTML()Analyse une chaîne comme du HTML et insère les éléments obtenus à un endroit choisi par rapport à l’élément.
- EventTarget.removeEventListener()Détache une fonction de gestion d’événement ajoutée plus tôt avec addEventListener(). Exige la même fonction et le même type d’événement.
- Element.getBoundingClientRect()Renvoie la taille d’un élément et sa position par rapport à la zone visible de la fenêtre, sous la forme d’un objet DOMRect.
- Element.scrollIntoView()Fait défiler la page et les conteneurs défilants pour que l’élément apparaisse à l’écran, par un saut ou en douceur.
- Element.childrenUne collection vivante des enfants directs d’un élément. Avec parentElement et nextElementSibling, elle sert à se déplacer dans l’arbre DOM.
- Node.cloneNode()Crée une copie d’un nœud. Avec l’argument true, elle copie aussi tout le contenu, c’est-à-dire tous les éléments et textes à l’intérieur.
- Element.replaceWith()Remplace un élément du document par d’autres éléments ou du texte. L’ancien élément est retiré de la page.
- Element.toggleAttribute()Ajoute un attribut s’il est absent, ou le retire s’il est présent. Particulièrement utile pour les attributs booléens, comme hidden ou disabled.
- HTMLElement.focus()Donne le focus à un élément, par ex. un champ de formulaire, pour qu’il reçoive immédiatement le clavier. La méthode blur() retire le focus.
- EventTarget.dispatchEvent()Déclenche un événement sur un élément depuis le code. Avec CustomEvent, elle permet de créer vos propres événements avec des données supplémentaires.
- getComputedStyle()Renvoie les styles calculés d’un élément, c’est-à-dire les valeurs CSS que le navigateur a réellement appliquées après avoir pris en compte toutes les règles.
API du navigateur
Stockage du navigateur, URL, historique, presse-papiers, observateurs et animations image par image.
- localStorageStockage du navigateur pour des paires clé-valeur qui survit à l’actualisation de la page et au redémarrage du navigateur.
- sessionStorageStockage du navigateur pour des paires clé-valeur qui ne fonctionne que dans l’onglet actuel et disparaît à sa fermeture.
- URLUn objet pour créer, lire et modifier des adresses URL. Il décompose une adresse en parties : protocole, hôte, chemin et paramètres.
- URLSearchParamsUn objet pour lire et construire les paramètres de requête d’une adresse, la partie après le caractère ?, par exemple ?cours=js&page=2.
- history.pushState()Ajoute une nouvelle entrée à l’historique du navigateur et change l’adresse dans la barre sans recharger la page.
- locationUn objet contenant des informations sur l’adresse de la page actuelle. Il permet de lire ses parties et de naviguer vers une autre adresse.
- navigator.clipboardAccès asynchrone au presse-papiers système. La méthode writeText() copie du texte, et readText() le lit depuis le presse-papiers.
- IntersectionObserverObserve si un élément est visible dans la fenêtre ou dans un conteneur défilant, et appelle une fonction quand cela change.
- ResizeObserverAppelle une fonction chaque fois que la taille d’un élément observé change, quelle qu’en soit la cause.
- MutationObserverObserve les changements dans l’arbre du DOM : éléments ajoutés et supprimés, changements d’attributs et de texte, et les signale dans une seule fonction.
- requestAnimationFrame()Planifie l’appel d’une fonction juste avant le prochain rafraîchissement de l’écran. Sert à créer des animations fluides pilotées par JavaScript.
- matchMedia()Vérifie en JavaScript si la page satisfait une media query CSS, par exemple (max-width: 600px), et permet de réagir à ses changements.
- FormDataRassemble les valeurs des champs d’un formulaire en paires nom-valeur. L’objet obtenu peut être lu ou envoyé au serveur avec fetch().
- AbortControllerPermet d’interrompre une opération asynchrone, par exemple une requête fetch(), et de détacher plusieurs gestionnaires d’événements en un seul appel à abort().
- console.log()Affiche des valeurs dans la console du navigateur. L’objet console a aussi les méthodes warn(), error(), table(), group(), time(), count() et assert().
Comparaisons
Les différences entre des méthodes et des constructions proches du langage, et quand choisir laquelle.
- map() vs forEach()map() construit un nouveau tableau à partir des résultats de la fonction ; forEach() se contente d’appeler la fonction pour chaque élément et renvoie toujours undefined.
- let vs const vs varconst et let ont une portée de bloc, var une portée de fonction, et const interdit la réaffectation. Écrivez const par défaut, let pour les valeurs qui changent.
- for...in vs for...offor...of fournit les valeurs successives d’un objet itérable, tandis que for...in fournit les noms successifs des propriétés d’un objet sous forme de chaînes.
- slice() vs splice()slice() copie un fragment du tableau sans modifier l’original, tandis que splice() supprime, insère ou remplace des éléments en place, en mutant le tableau.
- find() vs filter()find() renvoie le premier élément qui satisfait une condition, ou undefined, tandis que filter() renvoie un nouveau tableau avec tous les éléments qui ont passé le test.
- () => {} vs functionUne fonction ordinaire a son propre this et arguments, et peut être appelée avec new. Une fonction fléchée est plus courte et prend son this de l’environnement.
- localStorage vs sessionStoragelocalStorage et sessionStorage ont les mêmes méthodes, mais localStorage survit à la fermeture du navigateur, alors que sessionStorage s’efface avec l’onglet.
- innerHTML vs textContentinnerHTML lit et définit le code HTML d’un élément en l’analysant pour créer de nouveaux éléments, tandis que textContent lit et définit du texte brut, sans balises.
- querySelector() vs getElementById()querySelector() accepte tout sélecteur CSS et renvoie le premier élément correspondant ; getElementById() cherche seulement par l’attribut id, mais est plus simple.
- Promise.all() vs Promise.allSettled()Promise.all() est rejetée dès la première erreur et renvoie un tableau de résultats, tandis que Promise.allSettled() attend chaque promesse et n’est jamais rejetée.
- async/await vs then()async/await permet d’écrire du code asynchrone comme du code séquentiel, avec les erreurs dans try...catch, tandis que then() crée une chaîne d’appels sur la promesse.
- setTimeout() vs setInterval()setTimeout() appelle la fonction une seule fois après un délai donné ; setInterval() l’appelle de façon répétée jusqu’à ce que vous l’arrêtiez avec clearInterval().