ReactJS : Immutable.js : 合并两个 Json 对象

Question

我正在使用 React、Redux 和不可变。我尝试合并两个 Json 对象，数据和预期结果如下，

obj1 = 
{id: 1, first_name: "abc", surname: "def", children: ["kid1", "kid2"]}

obj2 = 
{first_name: "abc", surname: "def", email: "abc.def@gmail.com", mobile: ""}

mergedObj = {id: 1, first_name: "abc", surname: "def", email: "abc.def@gmail.com", Mobile: "",  children: ["kid1", "kid2"]}

如果 obj1 上没有数据，则应从 obj2 中获取。

我尝试使用如下所述的不可变合并，

import Immutable, {merge} from "immutable";
const mergedObj = merge(Immutable.fromJS(obj2), Immutable.fromJS(obj1));
console.log(mergedObj)

结果与 obj2 相同，本质上没有发生合并，

{first_name: "abc", surname: "def", email: "abc.def@gmail.com", mobile: ""}

Answer 1

您可以使用从 ES6 开始引入的 javascript 扩展运算符进行合并。

var obj1 = {id: 1, first_name: "abc", surname: "def", children: ["kid1", "kid2"]}

var obj2 = {first_name: "abc", surname: "def", email: "abc.def@gmail.com", mobile: ""}

var mergedObj = {...obj1,...obj2};

Answer 2

文档似乎表明您正确使用了 immutable.merge()。

遗憾的是，这一功能似乎已被破坏，正如您在 their live example 上看到的那样。

我建议提交一个问题/拉取请求来解决这个问题，但看起来像 immutable is now essentially unmaintained -- 该仓库有 26 个开放的拉取请求，上个月没有一个被合并。

---

无论如何，我认为 ES6+ JS 可以做到这一点。 在此之前，不可变是必须具备的，因为 JS 没有提供足够的开箱即用工具那个范式。

如果这是一个选项（或者即使不是，以下将按预期工作），请考虑 @AlwinJose 的使用 spread syntax for object literals 的建议，自 ES2018 起可用：

var mergedObj = {...obj1,...obj2};

（执行浅合并，就像Object.assign）

Answer 3

如果您以 POJO 开头并希望以 POJO 结尾，我建议使用上面提到的对象扩展语法（或Object.assign）。在这种情况下，不需要使用 Immutable。

如果你想使用 Immutable，并且你知道 obj1 和 obj2 是对象，你可以调用 Map(obj2).merge(obj1) 来代替，这绝对有效。 （基于我们代码库中的广泛使用。）

否则，文档声称您可以使用 POJO 调用 Immutable.merge，因此使用 Immutable.merge(obj2, obj1) 可能会更好，而忽略对 Immutable.fromJS 的调用。

Answer 4

示例数据=

        const json1 = [
            {id: 1, test: 1},
            {id: 2, test: 2},
            {id: 3, test: 3},
            {id: 4, test: 4},
            {id: 5, test: 5}
        ];

        const json2 = [
            {id: 3, test: 6},
            {id: 4, test: 7},
            {id: 5, test: 8},
            {id: 6, test: 9},
            {id: 7, test: 10}
        ];

示例1=

        const finalData1 = json1.concat(json2).reduce(function (index, obj) {
            index[obj.id] = Object.assign({}, obj, index[obj.id]);
            return index;
        }, []).filter(function (res, obj) {
            return obj;
        });

示例2=

        let hashData = new Map();

        json1.concat(json2).forEach(function (obj) {
            hashData.set(obj.id, Object.assign(hashData.get(obj.id) || {}, obj))
        });

        const finalData2 = Array.from(hashData.values());

我推荐第二个例子，它更快。