JavaScript Academy · Leçon

Appels et accès par indice optionnels

Utilisez le chaînage optionnel avec les appels et les crochets.

Appels et accès par indice optionnels est une leçon JavaScript Academy gratuite sur CoddyKit. Ceci est la leçon 4 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage JavaScript Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours JavaScript Academy comprend 4 leçons au total.

Au-delà de la lecture de propriétés

L’enchaînement optionnel permet également d’appeler des fonctions et d’accéder en toute sécurité aux éléments d’un tableau ou aux propriétés dont la clé est dynamique.

const obj = { greet: () => "hi" };
console.log(obj.greet?.()); // "hi"

Appels optionnels de méthodes

La forme ?.() appelle une fonction uniquement si elle existe. Si la méthode vaut null ou undefined, elle renvoie undefined au lieu de provoquer une exception.

const obj = {};
console.log(obj.greet?.()); // undefined, no error

Pourquoi est-ce important

Sans cet opérateur, l’appel d’une méthode absente provoque une exception. La forme d’appel optionnel protège proprement contre les fonctions de rappel facultatives.

function run(onDone) {
  onDone?.(); // safe whether or not onDone is provided
}
run();
run(() => console.log("done"));

Seules les valeurs nulles ou indéfinies ignorent l’appel

?.() ignore l’appel uniquement lorsque la valeur vaut null ou undefined. S’il s’agit d’une valeur qui n’est pas une fonction, l’appel provoque tout de même une TypeError.

const obj = { greet: 42 };
try {
  obj.greet?.();
} catch (e) {
  console.log("not a function");
}

Accès optionnel par indice

La forme ?.[ ] lit un élément uniquement si la base n’est ni nulle ni indéfinie, ce qui est utile pour les tableaux et les clés calculées.

const arr = ["a", "b"];
console.log(arr?.[1]); // "b"
const none = null;
console.log(none?.[0]); // undefined

Clés dynamiques

L’accès entre crochets avec ?. gère en toute sécurité les noms de propriétés dynamiques.

const data = { user: { name: "Mia" } };
const key = "name";
console.log(data.user?.[key]); // "Mia"

Tableaux imbriqués

Vous pouvez enchaîner les accès optionnels par indice dans des tableaux ou des objets imbriqués.

const grid = [[1, 2], [3, 4]];
console.log(grid?.[1]?.[0]); // 3
console.log(grid?.[5]?.[0]); // undefined

Appel optionnel de la valeur renvoyée

Vous pouvez combiner les formes : lire une valeur de manière optionnelle, puis l’appeler de manière optionnelle.

const handlers = { click: () => "clicked" };
console.log(handlers.click?.()); // "clicked"
console.log(handlers.hover?.()); // undefined

Combiner avec des valeurs par défaut

Associez ces formes à ?? pour fournir une solution de repli au résultat.

const config = {};
const port = config.get?.() ?? 3000;
console.log(port); // 3000

Appeler des méthodes de tableau en toute sécurité

L’enchaînement optionnel vous permet d’appeler une méthode sur un tableau potentiellement absent sans effectuer de vérification d’existence séparée.

const state = { tags: null };
console.log(state.tags?.join(", ") ?? "none"); // "none"

L’utiliser lorsque le caractère optionnel est réel

Ces formes sont particulièrement utiles pour les fonctions de rappel facultatives et les structures de données incertaines. Évitez-les lorsqu’une valeur devrait toujours exister, afin que les véritables erreurs restent visibles.

const events = { onSave: null };
events.onSave?.("payload"); // silently does nothing
console.log("continued");

Vérification rapide

Choisissez la forme d’appel sûre.

Récapitulatif

L’enchaînement optionnel comprend ?.() pour appeler des méthodes en toute sécurité et ?.[ ] pour accéder en toute sécurité à un indice ou à une clé dynamique. Les deux renvoient undefined lorsque la base est nulle ou indéfinie, mais provoquent toujours une exception si une valeur qui n’est pas une fonction est appelée. Combinez-les avec ?? pour fournir des valeurs par défaut et réservez-les aux valeurs réellement facultatives.

Questions Fréquemment Posées

La leçon « Appels et accès par indice optionnels » est-elle gratuite ?

Oui — le texte complet de « Appels et accès par indice optionnels » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours JavaScript Academy, passe à CoddyKit PRO. Le cours JavaScript Academy comprend 4 leçons au total.

Qu'est-ce que j'apprendrai dans « Appels et accès par indice optionnels » ?

Utilisez le chaînage optionnel avec les appels et les crochets. Tu pratiques JavaScript Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.

Dois-je avoir de l'expérience pour commencer JavaScript Academy ?

Aucune expérience préalable n'est requise. JavaScript Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 4 sur 4.

Combien de temps prend la leçon « Appels et accès par indice optionnels » ?

La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.

Peux-tu écrire et exécuter du code dans cette leçon JavaScript Academy ?

Oui. Chaque leçon JavaScript Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.

Toutes les leçons de ce cours

← Retour à JavaScript Academy