用相同的键合并来自不同对象的数组

Question

我有以下代码：

const blueData = {
    "items": [
        {
            "id": 35,
            "revision": 1,
            "updatedAt": "2021-09-10T14:29:54.595012Z",
        },
    ]
}

const redData = {}

const greenData = {
    "items": [
        {
            "id": 36,
            "revision": 1,
            "updatedAt": "2021-09-10T14:31:07.164368Z",
        }
    ]
}

let colorData = []
colorData = blueData.items ? [colorData, ...blueData.items] : colorData
colorData = redData.items ? [colorData, ...redData.items] : colorData
colorData = greenData.items ? [colorData, ...greenData.items] : colorData

我猜扩展操作符在这里不是正确的，因为我在我的最后一个colorData数组中得到了一些额外的数组。我只想构建一个“items”数组，其中包含来自这3个对象的所有“items”。

下面是指向es6控制台中的代码的链接：https://es6console.com/ktkhc3j2/

Answer 1

将数据放入数组中，然后使用flatMap展开每个.items

[greenData, redData, blueData].flatMap(d => d.items ?? [])
//=> [ {id: 36, revision: 1, updatedAt: '2021-09-10T14:31:07.164368Z'}
//=> , {id: 35, revision: 1, updatedAt: '2021-09-10T14:29:54.595012Z'}]

如果你喜欢的话，你可以用一点咖喱来抽象d => d.items ?? [] (没有双关的意思;)

const take = k => o => o[k] ?? [];

这给了我们：

[greenData, redData, blueData].flatMap(take('items'))

如果您需要用不同的键重复这个过程，我们甚至可以更进一步：

const concatBy = fn => xs => xs.flatMap(x => fn(x));

现在，你几乎感觉到你在用文字而不是代码来表达你的意图：

const takeItems = concatBy(take('items'));

takeItems([greenData, redData, blueData]);
//=> [ {id: 36, revision: 1, updatedAt: '2021-09-10T14:31:07.164368Z'}
//=> , {id: 35, revision: 1, updatedAt: '2021-09-

让我们构建另一个函数：

const takeFood = concatBy(take('food'));

takeFood([{food: ['', '']}, {food: ['', '']}]);
//=> ['', '', '', '']

增编

这只是作为一种潜在的有用的学习材料。我的建议是使用flatMap__。

这是：

[[1, 2], [3, 4]].flatMap(x => x)
//=> [1, 2, 3, 4]

也可以用reduce表示。稍长些，但照罐头上说的做：

[[1, 2], [3, 4]].reduce((xs, x) => xs.concat(x), [])
//=> [1, 2, 3, 4]

所以简单地说，你也可以这样做：

[greenData, redData, blueData].reduce((xs, x) => xs.concat(x.items ?? []), [])

Answer 2

您可以使用Logical OR operator来实现这一点，它允许在缺少items字段时提供一个默认值。

​

const blueData = { items: [ { id: 35, revision: 1, updatedAt: '2021-09-10T14:29:54.595012Z', }, ], };
const redData = {};
const greenData = { items: [ { id: 36, revision: 1, updatedAt: '2021-09-10T14:31:07.164368Z', }, ], };

const colorData = [
  ...(blueData.items || []),
  ...(redData.items || []),
  ...(greenData.items || []),
];

console.log(colorData);

​

Answer 3

也许我有点老套，但我会用concat来做这个：

concat()方法用于合并两个或多个数组。此方法不更改现有数组，而是返回一个新数组。对象/数组/连接

​

const blueData = {
    "items": [
        {
            "id": 35,
            "revision": 1,
            "updatedAt": "2021-09-10T14:29:54.595012Z",
        },
    ]
}

const redData = {}

const greenData = {
    "items": [
        {
            "id": 36,
            "revision": 1,
            "updatedAt": "2021-09-10T14:31:07.164368Z",
        }
    ]
}


const colorData = [].concat(blueData.items,redData.items,greenData.items).filter(x => x)

console.log(colorData)

​

最后一个filter用于删除未定义的值。