Vérifier l'égalité d'objets

JavaScriptJavaScriptBeginner
Pratiquer maintenant

This tutorial is from open-source community. Access the source code

💡 Ce tutoriel est traduit par l'IA à partir de la version anglaise. Pour voir la version originale, vous pouvez cliquer ici

Introduction

Dans ce laboratoire, nous allons explorer le concept d'égalité d'objets en JavaScript. Nous allons apprendre à effectuer une comparaison approfondie entre deux valeurs pour déterminer si elles sont équivalentes en utilisant diverses techniques, telles que vérifier si les valeurs sont identiques, vérifier si elles sont des valeurs non-objets avec une valeur équivalente, et utiliser Object.keys() pour vérifier si les deux valeurs ont le même nombre de clés. Nous allons également comprendre comment utiliser la récursion pour comparer des objets imbriqués.


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("JavaScript")) -.-> javascript/BasicConceptsGroup(["Basic Concepts"]) javascript(("JavaScript")) -.-> javascript/AdvancedConceptsGroup(["Advanced Concepts"]) javascript/BasicConceptsGroup -.-> javascript/variables("Variables") javascript/BasicConceptsGroup -.-> javascript/data_types("Data Types") javascript/BasicConceptsGroup -.-> javascript/arith_ops("Arithmetic Operators") javascript/BasicConceptsGroup -.-> javascript/comp_ops("Comparison Operators") javascript/BasicConceptsGroup -.-> javascript/cond_stmts("Conditional Statements") javascript/BasicConceptsGroup -.-> javascript/array_methods("Array Methods") javascript/AdvancedConceptsGroup -.-> javascript/proto_inherit("Prototypes and Inheritance") javascript/AdvancedConceptsGroup -.-> javascript/destr_assign("Destructuring Assignment") subgraph Lab Skills javascript/variables -.-> lab-28261{{"Vérifier l'égalité d'objets"}} javascript/data_types -.-> lab-28261{{"Vérifier l'égalité d'objets"}} javascript/arith_ops -.-> lab-28261{{"Vérifier l'égalité d'objets"}} javascript/comp_ops -.-> lab-28261{{"Vérifier l'égalité d'objets"}} javascript/cond_stmts -.-> lab-28261{{"Vérifier l'égalité d'objets"}} javascript/array_methods -.-> lab-28261{{"Vérifier l'égalité d'objets"}} javascript/proto_inherit -.-> lab-28261{{"Vérifier l'égalité d'objets"}} javascript/destr_assign -.-> lab-28261{{"Vérifier l'égalité d'objets"}} end

Comment vérifier l'égalité d'objets en JavaScript

Pour vérifier si deux valeurs sont équivalentes, suivez ces étapes :

  1. Ouvrez le Terminal/SSH et tapez node pour commencer à pratiquer la programmation.
  2. Effectuez une comparaison approfondie entre les deux valeurs en utilisant la fonction equals().
  3. Vérifiez si les deux valeurs sont identiques. Si c'est le cas, renvoyez true.
  4. Vérifiez si les deux valeurs sont des objets Date avec la même heure, en utilisant Date.prototype.getTime(). Si c'est le cas, renvoyez true.
  5. Vérifiez si les deux valeurs sont des valeurs non-objets avec une valeur équivalente (comparaison stricte). Si c'est le cas, renvoyez true.
  6. Vérifiez si seule une des valeurs est null ou undefined ou si leurs prototypes diffèrent. Si c'est le cas, renvoyez false.
  7. Si aucune des conditions ci-dessus n'est remplie, utilisez Object.keys() pour vérifier si les deux valeurs ont le même nombre de clés.
  8. Utilisez Array.prototype.every() pour vérifier si chaque clé dans a existe dans b et si elles sont équivalentes en appelant equals() de manière récursive.

Utilisez le code suivant pour implémenter la fonction equals() :

const equals = (a, b) => {
  if (a === b) return true;

  if (a instanceof Date && b instanceof Date)
    return a.getTime() === b.getTime();

  if (!a || !b || (typeof a !== "object" && typeof b !== "object"))
    return a === b;

  if (a.prototype !== b.prototype) return false;

  const keys = Object.keys(a);
  if (keys.length !== Object.keys(b).length) return false;

  return keys.every((k) => equals(a[k], b[k]));
};

Utilisez les exemples de code suivants pour tester la fonction equals() :

equals(
  { a: [2, { e: 3 }], b: [4], c: "foo" },
  { a: [2, { e: 3 }], b: [4], c: "foo" }
); // true

equals([1, 2, 3], { 0: 1, 1: 2, 2: 3 }); // true

Résumé

Félicitations ! Vous avez terminé le laboratoire sur la vérification de l'égalité d'objets. Vous pouvez pratiquer d'autres laboratoires dans LabEx pour améliorer vos compétences.