重构每个循环最有效的功能方法是什么?

Question

我有一个接受道具中的项目和可用项目的方法。在迭代数组时，我应该通过 forEach 循环中的两个条件过滤项目。如果项 ID 不存在或项 ID 等于 1，则传递第一个条件。第二个应该返回项目并过滤"描述"字段，否则，我们将项目推送到"nextAvailableItems"数组中。在这种情况下，替换 forEach 循环的最有效功能方法是什么？

项目结构：

[{
id: 23740416,
display_name: "test",
date_from: "1970-12-31"
}]

可用项目结构：

[{
id: 23740416,
display_name: "test",
description: "Text"
}]

预期产出：

[{
id: 23740416,
display_name: "test"
}]

当前代码：

buildAvailableItems() {
const { items, availableItems } = this.props
const nextAvailableItems = [...availableItems]
items.forEach(item => {
if (!item.id || item.id === -1) {
return
}
const availableItem = availableItems.find(availableItem => availableItem.id === item.id)
if (availableItem) {
const { id, display_name } = availableItem
return { id, display_name }
}
const { id, display_name } = item
nextAvailableItems.push({ id, display_name })
})
return nextAvailableItems
}

Answer 1

buildAvailableItems() {
const { items, availableItems } = this.props
const itemIds = items.reduce((c, i) => (c[i.id] = true, c), {})
const nextAvailableItems = availableItems
.filter(a => itemIds[a.id])
.map(a => ({ id: a.id, display_name: a.display_name }))
return [...availableItems, ...nextAvailableItems]
}

首先，我会items变成 ID 查找。然后使用该查找筛选availableItems。然后最后进行数组合并。