js 中两个数组对象比较某个字段是否相等|极客笔记

js 中两个数组对象比较某个字段是否相等

在前端开发中，经常会遇到需要比较两个数组对象的情况。而有时我们并不是要完全比较两个对象是否相等，而是想比较两个对象中某个特定字段的值是否相等。在JavaScript中，我们可以通过一些方法来轻松实现这个功能。本文将详细介绍如何比较两个数组对象中特定字段是否相等，同时给出相应的示例代码和运行结果。

情况一：两个数组对象有相同的对象顺序

首先假设我们有两个数组对象，每个对象中都有相同的字段名，我们需要比较这两个数组对象中特定字段的值是否相等。我们可以通过使用forEach方法来遍历两个数组对象，并逐一比较特定字段的值。以下是一个示例代码：

const arr1 = [
    { id: 1, name: "Alice" },
    { id: 2, name: "Bob" },
    { id: 3, name: "Charlie" }
];

const arr2 = [
    { id: 1, name: "Alice" },
    { id: 2, name: "Bobby" },
    { id: 3, name: "Charlie" }
];

let isEqual = true;

arr1.forEach((obj1, index) => {
    const obj2 = arr2[index];
    if(obj1.name !== obj2.name) {
        isEqual = false;
        return;
    }
});

console.log(isEqual); // Output: false

在上面的示例中，我们对数组arr1和arr2进行逐一比较，如果name字段的值不相等，我们将将isEqual标记为false。最终输出的结果为false，因为第二个对象中的名称有一个和第一个对象不同。

情况二：两个数组对象的对象顺序不同

如果两个数组对象的对象顺序不同，即使对象内容是一样的，我们也需要对两个数组进行适当处理才能比较特定字段的值。一种解决方法是先对两个数组对象进行排序，然后再进行比较。以下是一个示例代码：

const arr1 = [
    { id: 1, name: "Alice" },
    { id: 3, name: "Charlie" },
    { id: 2, name: "Bob" }
];

const arr2 = [
    { id: 2, name: "Bob" },
    { id: 1, name: "Alice" },
    { id: 3, name: "Charlie" }
];

arr1.sort((a, b) => a.id - b.id);
arr2.sort((a, b) => a.id - b.id);

let isEqual = true;

arr1.forEach((obj1, index) => {
    const obj2 = arr2[index];
    if(obj1.name !== obj2.name) {
        isEqual = false;
        return;
    }
});

console.log(isEqual); // Output: true

在上面的示例中，我们先对arr1和arr2进行排序，然后再进行逐一比较name字段的值。最终输出的结果为true，因为虽然两个数组对象的顺序不同，但是这两个数组对象中的值是相等的。

情况三：两个数组对象中的对象个数不同

除了两个数组对象的顺序不同外，还有一种情况是两个数组对象中的对象个数不同。在这种情况下，我们可以首先比较两个数组对象的长度，如果不同则直接返回false，如果长度相同再继续比较特定字段的值。以下是一个示例代码：

const arr1 = [
    { id: 1, name: "Alice" },
    { id: 2, name: "Bob" },
    { id: 3, name: "Charlie" }
];

const arr2 = [
    { id: 1, name: "Alice" },
    { id: 2, name: "Bob" }
];

if(arr1.length !== arr2.length) {
    console.log(false); // Output: false
} else {
    let isEqual = true;

    arr1.forEach((obj1, index) => {
        const obj2 = arr2[index];
        if(obj1.name !== obj2.name) {
            isEqual = false;
            return;
        }
    });

    console.log(isEqual); // Output: false
}

在上面的示例中，我们先判断arr1和arr2的长度是否相等，如果不相等直接返回false。而如果长度相等，再继续比较特定字段的值。最终输出的结果为false，因为arr2中的对象个数比arr1少一个。

通过以上的示例代码，我们可以看到如何在JavaScript中比较两个数组对象中特定字段的值是否相等。在实际开发中，我们可以根据具体情况选择不同的比较方法来满足我们的需求。