So sánh hai đối tượng JavaScript

Chúng tôi có hai đối tượng JavaScript tương tự và quan tâm đến việc tìm (các) khóa nào, nếu có, đã thay đổi ở cấp độ đầu tiên. Một khóa trong đối tượng có thể chứa bất kỳ loại dữ liệu nào trong giá trị của nó, bao gồm cả mảng và đối tượng và nó cũng có thể được lồng sâu. Thay đổi có thể có nghĩa là bất cứ điều gì, chẳng hạn như được thêm vào, được thêm vào, bị xóa, bị xóa khỏi, được sửa đổi, bị xáo trộn, v.v.

Bạn có thể yêu cầu loại nhận dạng khóa này trong trường hợp bạn so sánh trạng thái cũ và mới, chẳng hạn như bộ lọc trước đó và bộ lọc mới, đồng thời tìm ra chính xác những gì đã thay đổi

Dưới đây là mã để tìm một khóa đã thay đổi giá trị của nó giữa các đối tượng. Xa hơn nữa, có một mã được sửa đổi để nhận nhiều khóa được thay đổi

Mật mã

Bạn có thể viết mã so sánh hoặc mã tìm kiếm duy nhất của riêng mình cho mảng và đối tượng. Nhưng vì nó trở nên khá phức tạp với các cấp độ được lồng sâu hơn và do đó dẫn đến việc phát minh lại bánh xe, tôi thích các phương pháp lodash hơn là isEqualuniq. Mã này như sau

// es module
import { isEqual, uniq } from "lodash";

// OR commonJS
const _ = require("lodash");
const { isEqual, uniq } = _;

const getUpdatedKey = (oldData, newData) => {
  const data = uniq([...Object.keys(oldData), ...Object.keys(newData)]);

  for(const key of data){
    if(!isEqual(oldData[key], newData[key])){
      return key;
    }
  }

  return null;
}

Mã giải thích

  • Lấy các khóa duy nhất từ ​​cả hai đối tượng trong một mảng phẳng
  • Lặp qua mảng. Đối với mỗi khóa, hãy kiểm tra xem dữ liệu đối với khóa đó trong cả hai đối tượng có ảnh hưởng lẫn nhau không
  • Nếu không bằng có nghĩa là giá trị key đã thay đổi. Vì vậy, hãy trả lại chìa khóa (dừng vòng lặp trên đường đi của nó)
  • Nếu không có gì thay đổi, hãy trả lại null

Dữ liệu & Kết quả Ví dụ

let oldObj;
let newObj;

oldObj = {
  countries: ["Pakistan", "India", "Japan", "England", "United States"],
  nationalities: ["American", "British", "Pakistani", "Indian", "Chinese"]
};

newObj = {
  countries: ["Pakistan", "India", "Japan", "England"],
  nationalities: ["American", "British", "Pakistani", "Indian", "Chinese"]
}

console.log(getUpdatedKey(oldObj, newObj)); // countries

oldObj = {
  countries: ["Pakistan", "India", "Japan", "England", "United States"],
  nationalities: ["American", "British", "Pakistani", "Indian", "Chinese"]
};

newObj = {
  countries: ["Pakistan", "India", "Japan", "United States", "England"],
  nationalities: ["American", "British", "Pakistani", "Indian", "Chinese"]
}

console.log(getUpdatedKey(oldObj, newObj)); // countries

oldObj = {
  countries: ["Pakistan", "India", "Japan", "England", "United States"],
  nationalities: ["American", "British", "Pakistani", "Indian", "Chinese"]
};

newObj = {
  countries: ["Pakistan", "India", "Japan", "England", "United States"],
  nationalities: ["American", "British", "Pakistani", "Indian"]
}

console.log(getUpdatedKey(oldObj, newObj)); // nationalities

oldObj = {
  id: "ioj86bndom",
  name: {
    first: "John",
    middle: "Montgomery",
    last: "Smith"
  },
  address: {
    street: "660 K St",
    city: "San Diego",
    state: "California",
    country: "United States"
  }
};

newObj = {
  id: "ioj86bndom",
  name: {
    first: "John",
    middle: "Montgomery",
    last: "Smith"
  },
  address: {
    street: "4914 U.S. 220 Business",
    city: "Randleman",
    state: "Nebraska",
    country: "United States"
  }
};

console.log(getUpdatedKey(oldObj, newObj)); // address


oldObj = {
  id: "ioj86bndom",
  name: {
    first: "John",
    middle: "Montgomery",
    last: "Smith"
  },
  address: {
    street: "660 K St",
    city: "San Diego",
    state: "California",
    country: "United States"
  }
};

newObj = {
  id: "ioj86bndom",
  name: {
    first: "John",
    last: "Smith"
  },
  address: {
    street: "4914 U.S. 220 Business",
    city: "Randleman",
    state: "Nebraska",
    country: "United States"
  }
};

console.log(getUpdatedKey(oldObj, newObj)); // name

Mã để nhận nhiều khóa được cập nhật

Đoạn mã trên sẽ chỉ xác định khóa đầu tiên phù hợp với tiêu chí. Chúng tôi có thể sửa đổi nó một chút để trả về nhiều hơn một khóa bằng cách giữ một mảng, đẩy vào đó và trả về ở cuối

Làm cách nào để so sánh 2 đối tượng trong js?

Toán tử đẳng thức (===) xác minh xem hai toán hạng có bằng nhau hay không và trả về giá trị Boolean . Nếu cả hai toán hạng có kiểu khác nhau, toán tử này trả về false, ngược lại trả về true.

Làm cách nào để so sánh hai đối tượng trong JavaScript và nhận được sự khác biệt?

compareObject() Hàm này như tên trạng thái sẽ được sử dụng để so sánh 2 đối tượng và nó hoạt động đối với các đối tượng chứa các thuộc tính đơn giản nhưng không phức tạp. Trong trường hợp này, một thuộc tính phức tạp có thể được xem như một thuộc tính mà giá trị của chúng chứa các mảng hoặc các đối tượng khác bên trong chúng

Bạn có thể so sánh các đối tượng trong JavaScript không?

So sánh các đối tượng rất dễ dàng, sử dụng === hoặc Object. Là(). Hàm này trả về true nếu chúng có cùng tham chiếu và false nếu chúng không. Một lần nữa, tôi xin nhấn mạnh, đó là so sánh các tham chiếu đến các đối tượng, không phải các khóa và giá trị của các đối tượng. Vì vậy, từ Ví dụ 3, Đối tượng. là(obj1,obj2);

Bạn có thể sử dụng == để so sánh các đối tượng không?

Toán tử == so sánh xem hai tham chiếu đối tượng có trỏ đến cùng một đối tượng hay không .