找出两个 JavaScript 对象之间的差异答案

【问题标题】：Finding the differences between two JavaScript Objects找出两个 JavaScript 对象之间的差异
【发布时间】：2022-01-04 11:52:09
【问题描述】：

是的，有很多标题与此类似的问题，我可以向您保证，我已经测试了几乎所有问题。谷歌扔给我的所有东西，我都试过了。一个都不够。

考虑这两个对象：

const o1 = {
  "someProperty": "someValue",
  "anotherProperty": {
    "p1": "v1",
    "p2": "v2"
  }
}

const o2 = {
  "anotherProperty": {
    "p1": "v1",
    "p2": "v2"
  }
}

如何通过顶级键找到o2 和o1 之间的区别，我相信，没有通过将属性值设置为undefined（老实说，我发现这个答案很荒谬）。

我为什么需要这个？这里描述的o1 包含“所有数据”和o2 将被删除的子集，因此我可以执行更新。您可以将 if 视为交集的倒数。

在上面的伪代码中，我想要的输出是：

const diff = {
  "someProperty": "someValue"
}

当然，这是一个过于简单的例子，实际上我还有许多其他属性，具有不同的值，总是原始数据类型（纯文本，整数，布尔值......）一级嵌套（如@ 987654330@) 或更深层次，但总是原始类型。

听起来很简单，但如果没有 NodeJS、Lodash、Underscore 或任何其他第三方库，我就找不到任何东西。

【问题讨论】：

而实际的问题究竟是什么？获取o1和o2（Object.keys()）的keys，在o1的keys中找到唯一的条目，并根据这些keys创建diff。
你说的是顶级键，那么嵌套属性也应该检查吗？假设键保持不变，但其嵌套属性发生变化。您想要的解决方案是否将此键及其值保留在 diff 对象之外？
“按顶级键”是什么意思？也许你只想要const toRemove = new Set(Object.keys(o2)); const result = Object.fromEntries(Object.entries(o1).filter(([key]) => !toRemove.has(key)));。
请不要只写你尝试了所有方法，向我们展示你尝试过的代码的实际示例以及它们如何不适合你的特定情况。还包括您找到的答案的链接。
（稍作调整 a）重复：How to get a subset of a javascript object's properties，尤其是答案：stackoverflow.com/a/56592365/402037

标签： javascript javascript-objects difference

【解决方案1】：

您可以获取条目并进行检查。对于对象执行相同的操作并检查结果是否有一些键。

const
    getDifference = (a, b) => Object.fromEntries(Object
        .entries(a)
        .reduce((r, [k, v]) => {
            if (v && typeof v === 'object') {
                let temp = getDifference(v, b[k] || {});
                if (Object.keys(temp).length) r.push([k, temp]);
            } else {
                if (v !== b[k]) r.push([k, v]);
            }
            return r;
        }, [])
    ),
    o1 = { someProperty: "someValue", anotherProperty: { p1: "v1", p2: "v2", p3: 'v3' }, n1: { n2: { n3: 42 } } },
    o2 = { someProperty: "someValue", anotherProperty: { p1: "v1", p2: "v2" } },
    o3 = { anotherProperty: { p1: "v1", p2: "v2" } };

console.log(getDifference(o1, o3));
console.log(getDifference(o2, o3));

.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：