按条件 React JS 转换对象数组答案

【问题标题】：Transform array of objects by condition React JS按条件 React JS 转换对象数组
【发布时间】：2023-02-02 22:13:07
【问题描述】：

我以下列格式从服务器获取一组对象：

[
    {
        "country": "UK",
        "name": "Battery Ltd 1",
        "type": "contact"
    },
    {
        "country": "USA",
        "name": "Technologies Inc. 1",
        "type": "contact"
    },
    {
        "country": "",
        "name": "Jayne Mansfield",
        "type": "representative"
    },
    {
        "country": "China",
        "name": "Technologies Inc. 2",
        "type": "contact"
    },
    {
        "country": "",
        "name": "Dan Borrington",
        "type": "representative"
    },
    {
        "country": "",
        "name": "Susan Reedy",
        "type": "representative"
    }
]

但是，我需要遍历这个对象数组并将其转换为这种格式：我想将 CONTACT 类型与以下一个或多个 REPRESENTATIVE 对象组合起来。也就是说，在输出中，我想得到这样一个带有数组的数组：

[
    [
        {
            "country": "UK",
            "name": "Battery Ltd 1",
            "type": "contact"
        }
    ],
    [
        {
            "country": "USA",
            "name": "Technologies Inc. 1",
            "type": "contact"
        },
        {
            "country": "",
            "name": "Jayne Mansfield",
            "type": "representative"
        },
    ],
    [
        {
            "country": "China",
            "name": "Technologies Inc. 2",
            "type": "contact"
        },
        {
            "country": "",
            "name": "Dan Borrington",
            "type": "representative"
        },
        {
            "country": "",
            "name": "Susan Reedy",
            "type": "representative"
        }
    ]
]

【问题讨论】：

连接的标准是什么？总是 3 个对象？
可能有更多对象。主要问题是我无法弄清楚如何遍历数组，以便在每个 REPRESENTATIVE 类型之后，如果没有其他元素或下一个 CONTACT 类型的元素，则关闭内部数组

标签： javascript reactjs arrays object

【解决方案1】：

如果元素是联系人，您可以遍历元素并创建一个组，否则添加到组中：

const data = [
    {
        "country": "UK",
        "name": "Battery Ltd 1",
        "type": "contact"
    },
    {
        "country": "USA",
        "name": "Technologies Inc. 1",
        "type": "contact"
    },
    {
        "country": "",
        "name": "Jayne Mansfield",
        "type": "representative"
    },
    {
        "country": "China",
        "name": "Technologies Inc. 2",
        "type": "contact"
    },
    {
        "country": "",
        "name": "Dan Borrington",
        "type": "representative"
    },
    {
        "country": "",
        "name": "Susan Reedy",
        "type": "representative"
    }
]

const result = data.reduce( (r, e) => (e.type === 'contact' ? r.push([e]) : r[r.length -1].push(e), r), [])
console.log(result)

【讨论】：

非常感谢你，你帮了我很多！

【解决方案2】：

const array = []
let current = []
let hasRepresentative = false

for (const item of getItems()) {
  if (current.length === 0) {
    current.push(item)
    continue
  }
  if (hasRepresentative && item.type === 'contact') {
    array.push(current)
    current = [item]
    continue
  }
  current.push(item)
  hasRepresentative = true
}
array.push(current)

console.log(array)

function getItems() { return [
    {
        "country": "UK",
        "name": "Battery Ltd 1",
        "type": "contact"
    },
    {
        "country": "USA",
        "name": "Technologies Inc. 1",
        "type": "contact"
    },
    {
        "country": "",
        "name": "Jayne Mansfield",
        "type": "representative"
    },
    {
        "country": "China",
        "name": "Technologies Inc. 2",
        "type": "contact"
    },
    {
        "country": "",
        "name": "Dan Borrington",
        "type": "representative"
    },
    {
        "country": "",
        "name": "Susan Reedy",
        "type": "representative"
    }
]
}

【讨论】：