0Pricing
TypeScript Academy · Leçon

Valeurs par défaut lors de la déstructuration

Combiner des valeurs par défaut et des annotations de type en toute sécurité.

Valeurs par défaut lors de la déstructuration est une leçon TypeScript Academy gratuite sur CoddyKit. Ceci est la leçon 3 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 TypeScript Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours TypeScript Academy comprend 4 leçons au total.

Combler les vides

Les valeurs par défaut de la déstructuration fournissent une valeur de repli lorsqu'une propriété ou un élément est absent ou vaut undefined. Associées à l'inférence de TypeScript, elles rendent les configurations facultatives pratiques et sûres.

Une valeur par défaut dans une déstructuration d'objet

Écrivez = value après une liaison pour lui attribuer une valeur de repli. Si la propriété est absente ou vaut undefined, la valeur par défaut est utilisée à la place.

const opts: { count?: number } = {}
const { count = 0 } = opts
console.log(count) // 0

Valeurs par défaut et propriétés facultatives

Les valeurs par défaut s'associent naturellement aux propriétés facultatives (?). La valeur par défaut élimine le cas undefined, de sorte que la variable résultante possède le type non facultatif.

interface Opts { retries?: number }
function connect(opts: Opts) {
  const { retries = 3 } = opts
  // retries is number, not number | undefined
  return retries * 2
}
console.log(connect({}))

Valeurs par défaut et types déduits

Si vous n'annotez pas la variable, TypeScript en déduit le type à partir de la valeur par défaut. Ici, 0 fait de count un number.

const settings: { count?: number; label?: string } = { label: "hi" }
const { count = 0, label = "none" } = settings
console.log(count, label) // 0 hi

Seul undefined déclenche la valeur par défaut

Un point subtil : les valeurs par défaut s'appliquent uniquement à undefined, jamais aux autres valeurs fausses comme 0, "" ou null. Celles-ci sont transmises sans modification.

const { x = 10 } = { x: 0 }
console.log(x) // 0, not 10 — 0 is not undefined
const { y = 10 } = { y: undefined as number | undefined }
console.log(y) // 10

Valeurs par défaut des paramètres de fonction

Les valeurs par défaut de paramètres déstructurés rendent les options facultatives très simples à utiliser. Chaque champ peut avoir sa propre valeur de repli directement dans la signature.

function draw({ x = 0, y = 0 }: { x?: number; y?: number }) {
  return x + "," + y
}
console.log(draw({ x: 5 })) // 5,0

Définir une valeur par défaut pour tout le paramètre

Pour permettre aux appelants d'omettre complètement l'objet d'arguments, attribuez au paramètre lui-même la valeur par défaut {}. Sans cela, un appel sans argument provoquerait une erreur.

function draw({ x = 0, y = 0 }: { x?: number; y?: number } = {}) {
  return x + "," + y
}
console.log(draw()) // 0,0

Valeurs par défaut et renommage

Vous pouvez renommer et définir une valeur par défaut dans une même liaison : commencez par renommer, puis ajoutez la valeur par défaut après le nouveau nom.

const { count: total = 0 } = { } as { count?: number }
console.log(total) // 0

Valeurs par défaut calculées

Une valeur par défaut peut être n'importe quelle expression, même une expression qui fait référence aux liaisons précédentes. Elle est évaluée à la demande — uniquement lorsque la valeur est effectivement absente.

function make({ width = 100, height = width }: { width?: number; height?: number } = {}) {
  return width + "x" + height
}
console.log(make({ width: 50 })) // 50x50

Récapitulatif des valeurs par défaut dans les tableaux

Les valeurs par défaut fonctionnent aussi lors de la déstructuration de tableaux : elles s'appliquent à chaque position lorsqu'un élément est absent ou vaut undefined.

const [a = 1, b = 2, c = 3] = [10, undefined]
console.log(a, b, c) // 10 2 3

Quand les valeurs par défaut sont particulièrement utiles

Les valeurs par défaut sont idéales pour les objets d'options : les appelants indiquent uniquement ce qui les intéresse, et la fonction fournit des valeurs de repli cohérentes. Elles retirent également undefined des types déduits, ce qui simplifie le corps de la fonction.

interface Config { debug?: boolean; level?: number }
const init = ({ debug = false, level = 1 }: Config = {}) => debug ? level : 0
console.log(init({ debug: true, level: 5 }))

Vérification rapide

Testez votre compréhension des valeurs par défaut de la déstructuration.

Récapitulatif

Les valeurs par défaut de la déstructuration (= fallback) s'appliquent uniquement lorsqu'une valeur est absente ou vaut undefined — jamais pour les autres valeurs fausses. Elles retirent undefined des types de propriétés facultatives, peuvent être déduites ou annotées, prennent en charge le renommage et peuvent faire référence aux liaisons précédentes. Pour les objets d'options, définissez le paramètre par défaut sur {} afin que les appelants puissent l'omettre complètement.

Questions Fréquemment Posées

La leçon « Valeurs par défaut lors de la déstructuration » est-elle gratuite ?

Oui — le texte complet de « Valeurs par défaut lors de la déstructuration » 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 TypeScript Academy, passe à CoddyKit PRO. Le cours TypeScript Academy comprend 4 leçons au total.

Qu'est-ce que j'apprendrai dans « Valeurs par défaut lors de la déstructuration » ?

Combiner des valeurs par défaut et des annotations de type en toute sécurité. Tu pratiques TypeScript 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 TypeScript Academy ?

Aucune expérience préalable n'est requise. TypeScript 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 3 sur 4.

Combien de temps prend la leçon « Valeurs par défaut lors de la déstructuration » ?

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 TypeScript Academy ?

Oui. Chaque leçon TypeScript 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

  1. Types et déstructuration d’objets
  2. Déstructuration de tableaux et de tuples
  3. Valeurs par défaut lors de la déstructuration
  4. Modèles de déstructuration imbriquée
← Retour à TypeScript Academy