首页  >  文章  >  web前端  >  如何在 JavaScript 中比较两个对象以确定第一个对象是否包含与第二个对象相同的属性值?

如何在 JavaScript 中比较两个对象以确定第一个对象是否包含与第二个对象相同的属性值?

王林
王林转载
2023-08-24 21:09:021021浏览

如何在 JavaScript 中比较两个对象以确定第一个对象是否包含与第二个对象相同的属性值?

在 JavaScript 中,对象包含各种属性和方法。对于每个属性,它都包含一个值。我们还需要比较属性的值来进行两个对象之间的比较。

在这里,我们将学习检查第一个对象是否包含第二个对象包含的所有属性,并比较每个属性的值。

一一比较对象属性值

最简单的方法是检查第一个对象是否包含第二个对象的每个属性。如果第一个对象包含该属性,则比较两者的值。

这意味着我们将在此方法中一一比较所有属性。

语法

用户可以按照以下语法检查第一个对象是否包含第二个对象在 JavaScript 中具有相同值的所有属性。

if (obj1.prop1 === obj2.prop2 && obj1.prop2 === obj.prop2) {
   // obj1 contains the all properties of obj2 with equivalent values
} else {
   // property values are mismatched
}

在上述语法中,obj1 和 obj2 是包含不同属性的不同对象。

示例

在下面的示例中,我们创建了 obj1 和 obj2 对象。我们使用 if-else 条件语句将 object2 的所有属性值与 object1 的属性值进行比较。

<html>
<body>
   <h2>Using the <i>strict equality</i> operator to compare object properties.</h2>
   <div id = "output"> </div>
   <script>
      let output = document.getElementById('output');
      let obj1 = {
         prop1: "Value1",
         prop2: "Value2",
         prop3: 40,
         prop4: false
      }
      let obj2 = {
         prop1: "Value1",
         prop3: 40
      }
      if (obj1.prop1 === obj2.prop2 && obj1.prop3 === obj.prop3) {
         output.innerHTML += "The obj1 contains all properties of obj2 with the equivalent values.";
      } else {
         output.innerHTML += "The properties or property values of obj1 and obj2 are mismatched.";
      }
   </script>
</body>
</html>

使用 forEach 循环比较第二个对象的属性与第一个对象的属性

在这种方法中,我们将使用 JavaScript forEach 循环来迭代第二个对象的所有键,并将其值与第一个对象的等效属性值进行匹配。我们可以获取数组中对象的所有键。之后,我们可以使用 forEach 循环遍历键数组。

语法

用户可以按照以下语法使用 forEach 循环来确定第一个对象是否包含与第二个对象等效的属性值。

Object.keys(student2).forEach((key) => {
   if (student2[key] !== student1[key]) {
      isSame = false;
   }
})

在上面的语法中,我们将student2对象与student1对象的每个键的值进行比较。

示例

在下面的示例中,我们创建了包含不同属性的student1和student2对象。之后,我们使用Object.keys()方法获取student2对象的所有键。接下来,我们使用 forEach 循环遍历 Student2 对象的所有键。

我们比较student2对象和student1对象的键值。在输出中,我们可以观察到它打印“对象属性和值不匹配”,因为 Student1 对象不包含年份属性。

<html>
<body>
   <h3>Using the <i>forEach loop</i> to compare the first object's property values with the second object's property value. </h3>
   <div id = "output"></div>
   <script>
      let output = document.getElementById('output');
      let student1 = {
         id: "13",
         name: "Shubham",
         age: 12,
         std: 6
      }
      let student2 = {
         id: "13",
         name: "shubham",
         year: 12,
      }
      let isSame = true;
         Object.keys(student2).forEach((key) => {
            if (student2[key] !== student1[key]) {
               isSame = false;
            }
         })
      if (isSame) {
         output.innerHTML += "Object properties and values are matched."
      } else {
         output.innerHTML += "Object properties and values are not matched."
      }
   </script>
</body>
</html>

使用 array.every() 方法

JavaScript array.every() 方法检查数组的每个元素是否遵循特定条件。例如,我们可以使用 array.every() 方法来检查所有数组数字是否都小于 100。

这里,我们将使用 array.every() 方法来检查 object1 是否包含 object2 具有相同值的每个属性。

语法

用户可以按照以下语法使用 array.every() 方法来确定第一个对象是否包含与第二个对象相同的属性值。

let result = Object.keys(table2).every((key) => table1[key] != undefined && table1[key] === table2[key]);

在上面的语法中,如果特定属性的值未定义,则该属性在对象中不存在。之后,我们比较了属性值。

示例

在下面的示例中,table1 对象包含与 table1 对象具有等效值的所有属性。我们使用 Object.keys() 来获取数组中的所有键,并对该数组使用 every() 方法。

我们将回调函数作为参数传递给 every() 方法,该方法将键作为参数。因此,我们正在检查 table1 对象中是否存在该键,如果存在,它是否包含与 table2 对象相同的值?

如果table1对象包含table2对象的每个键且值相等,则返回true;否则,将返回 false。



   

Using the array.every to compare the first object's property values with the second object's property value.

<script> let output = document.getElementById('output'); let table1 = { _id: 76, colour: "#456754", size: 30 } let table2 = { _id: 76, colour: "#456754", size: 30 } function compareObjectProperties(table1, table2) { let result = Object.keys(table2).every((key) =&gt; table1[key] != undefined &amp;&amp; table1[key] === table2[key]); if (result) { output.innerHTML += "Object properties and values are matched." } else { output.innerHTML += "Object properties and values are not matched." } } compareObjectProperties(table1, table2); </script>

在本教程中,我们学习了使用不同的方法检查第一个对象是否包含第二个对象的所有属性以及相同的值。最好的方法是使用 array.every() 方法,因为它包含一行代码。

以上是如何在 JavaScript 中比较两个对象以确定第一个对象是否包含与第二个对象相同的属性值?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文转载于:tutorialspoint.com。如有侵权,请联系admin@php.cn删除