Vérification de l'existence d'une clé dans un objet JavaScript : 3 méthodes pour les débutants

Vérification de l'existence d'une clé dans un objet JavaScript : analyse pour débutants

Avez-vous déjà essayé d'obtenir une valeur d'un objet JavaScript et reçu en réponse un mystérieux undefined ? Une situation familière, n'est-ce pas ? Surtout lorsque vous travaillez avec des données provenant d'API, des configurations ou simplement de grandes structures. Aujourd'hui, nous allons une fois pour toutes comprendre comment vérifier correctement si une clé existe dans un objet. C'est l'une des questions les plus populaires sur Stack Overflow — et pour cause.

Imaginez que l'objet est une armoire avec des tiroirs. Vous voulez savoir s'il y a un tiroir étiqueté "clés". Vous pouvez simplement tirer sur la poignée (et obtenir une erreur si le tiroir n'existe pas), ou d'abord regarder et vous assurer. En JavaScript, nous avons trois méthodes fiables pour le faire. C'est parti !

Pourquoi vérifier la présence d'une clé ?

Supposons que vous écriviez une application pour une liste de courses. Vous avez un objet cart qui peut contenir des articles avec des quantités :

const cart = {\n  apples: 3,\n  bananas: 5\n};\n\n// Nous voulons ajouter des poires, mais nous ne savons pas si elles existent déjà\nfunction addItem(item, quantity) {\n  if (cart[item] !== undefined) {\n    cart[item] += quantity;\n  } else {\n    cart[item] = quantity;\n  }\n}

Ce code fonctionnera, mais il comporte des pièges. Que faire si la valeur de la clé est 0 ou null ? Alors la vérification de undefined donnera un résultat erroné. Examinons donc les approches professionnelles.

Méthode 1 : L'opérateur in — le soldat universel

L'opérateur in vérifie si une propriété existe dans l'objet, y compris les propriétés héritées. C'est la méthode la plus fiable lorsque vous avez besoin de savoir si une clé existe.

const user = {\n  name: 'Anna',\n  age: 25,\n  isAdmin: false\n};\n\nconsole.log('name' in user);    // true\nconsole.log('age' in user);     // true\nconsole.log('salary' in user);  // false\nconsole.log('toString' in user); // true (hérité de Object)

Avantages : fonctionne même si la valeur est null, undefined ou false. Vérifie toute la chaîne de prototypes.

Inconvénients : peut trouver des propriétés héritées dont vous n'avez pas besoin. Par exemple, toString ou hasOwnProperty.

Dans la plupart des cas, in est le choix idéal. Surtout lorsque vous travaillez avec des objets dictionnaires ordinaires.

Méthode 2 : hasOwnProperty() — uniquement vos propres clés

Si vous devez vérifier uniquement les propriétés propres de l'objet (non héritées), utilisez la méthode hasOwnProperty. C'est une méthode standard de tous les objets en JavaScript.

const book = {\n  title: 'JavaScript pour les nuls',\n  pages: 300\n};\n\nconsole.log(book.hasOwnProperty('title'));   // true\nconsole.log(book.hasOwnProperty('pages'));   // true\nconsole.log(book.hasOwnProperty('toString')); // false (propriété non propre)\nconsole.log(book.hasOwnProperty('author'));   // false

Notez que hasOwnProperty ne vérifie pas les propriétés héritées. Cela le rend indispensable lorsque vous créez des objets avec des classes ou des prototypes.

Mais il y a une nuance ! Si votre objet a été créé avec Object.create(null), il n'aura pas la méthode hasOwnProperty. Que faire ? Utilisez un appel sécurisé :

const dict = Object.create(null);\ndict.key1 = 'value1';\n\n// Cela ne fonctionnera pas :\n// console.log(dict.hasOwnProperty('key1')); // TypeError\n\n// Mais cela, oui :\nconsole.log(Object.prototype.hasOwnProperty.call(dict, 'key1')); // true

La syntaxe moderne permet d'utiliser Object.hasOwn() — une méthode statique ajoutée dans ES2022. Elle résout ce problème de manière élégante :

console.log(Object.hasOwn(dict, 'key1')); // true

Je recommande d'utiliser Obj