JS / ES6: Destruction d'indéfinis

Question

J'utilise une déstructuration comme celle-ci:

 const { item } = content
console.log(item)
 

Mais comment dois-je gérer content === undefined - ce qui provoquera une erreur?

L'ancienne méthode ressemblerait à ceci:

 const item = content && content.item
 

Ainsi, si content n'est pas défini -> item sera également non défini.

Puis-je faire quelque chose de similaire en utilisant la déstructuration?

Answer 1

Vous pouvez utiliser le court-circuit d'évaluation pour fournir une valeur par défaut si content est un falsy valeur, habituellement undefined ou null dans ce cas.

const content = undefined
const { item } = content || {}
console.log(item)                       // undefined

Moins idiomatiques (voir ce commentaire) est de diffuser le contenu dans un objet avant de déstructuration, car null et undefineds valeurs sont ignorées.

const content = undefined
const { item } = { ...content }
console.log(item) // undefined

Si vous êtes à la déstructuration de la fonction params vous pouvez fournir une valeur par défaut (= {} dans l'exemple).

Remarque: La valeur par défaut ne serait appliqué que si le déstructuré param est - undefined, ce qui signifie que la déstructuration null valeurs lèvera une erreur.

const getItem = ({ item } = {}) => item
console.log(getItem({ item: "thing" })) // "thing"
console.log(getItem())                  // undefined

try {
  getItem(null)
} catch(e) {
  console.log(e.message)                // Error - Cannot destructure property `item` of 'undefined' or 'null'.
}

Ou même de définir une valeur par défaut pour l' item de la propriété si l'entrée de l'objet ne contient pas la propriété

const getItem = ({ item = "default" } = {}) => item
console.log(getItem({ item: "thing" })) // "thing"
console.log(getItem({ foo: "bar" }))    // "default"

Answer 2

La réponse acceptée ne fonctionne pas pour les valeurs véritablement non définies qui n'ont pas été définies par const content = undefined . dans de tels cas, cela fonctionnera:

 const { item } = (typeof content !== 'undefined' && content) || {}
console.log(item)