将数组和对象转换为自定义对象答案

【问题标题】：transform array and object to customized object将数组和对象转换为自定义对象
【发布时间】：2021-07-07 12:39:19
【问题描述】：

我想写一个函数来传输这个对象

const input1 = ["monkey","bananas"];

const input2 = {
  {
    id: 1,
    name: "monkey.play",
  },
  {
    id: 2,
    name: "monkey.run",
  },
  {
    id: 3,
    name: "bananas.eat",
  },
};

成为那样的人

const output = [
  {
    name: "monkey",
    actions: ["play","run"],
    
  },
{
    name: "bananas",
    actions: ["eat"],
    
  },
];

我尝试使用 Array.reduce，但我不知道如何渲染它。如果有人对此有任何后见之明，我想使用 postid 合并两个输入，那么我可以使用 map 来循环或减少吗，如果有人可以帮助我这样做，我将非常感激，如果你有任何 reduce/map 教程

【问题讨论】：

标签： javascript node.js arrays reactjs vue.js

【解决方案1】：

首先，您的 input2 对象结构不正确。您需要使用方括号而不是花括号。

现在，您可以通过拆分name 字段并将第一部分用作本地“名称”并将第二部分用作“操作”来减少每个项目。在减少时，您可以通过在现有（或新）数组上使用扩展运算符连接来构建操作列表。最后，取出您减少的新对象并提取值。

const input = [
  { id: 1, name: "monkey.play" },
  { id: 2, name: "monkey.run"  },
  { id: 3, name: "bananas.eat" }
];

const ouptut = Object.values(input.reduce((acc, { id, name }) =>
  (([_name, _action]) =>
    ({
      ...acc,
      [_name]: {
        ...acc[_name],
        name: _name,
        actions: [...(acc[_name]?.actions || []), _action]
      }
    }))
  (name.split(/\./)), {}));
  
console.log(ouptut);

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

【讨论】：

【解决方案2】：

这是另一种方法，只需循环您的两个输入。请注意，您的第二个输入也需要是一个数组。

通过拆分字符串，您可以检查名称是否匹配并将值传递给操作。

const input1 = ["monkey", "bananas"];

const input2 = [
  {
    id: 1,
    name: "monkey.play",
  },
  {
    id: 2,
    name: "monkey.run",
  },
  {
    id: 3,
    name: "bananas.eat",
  },
];

const output = input1.map(inputName => {
    // create the new object structre
    const obj = {
        name: null,
        actions: []
    }
    // loop over the second input, split the strings
    input2.forEach(action => {
        const inputAction = action.name.split('.')
        // check if the first string matches your input1 and push the value via index into the actions array
        if (inputAction[0] === inputName) obj.actions.push(inputAction[1])
    })
    obj.name = inputName // assing the name to the object
    return obj
})
console.log(output)

【讨论】：

【解决方案3】：

已提供答案的更简洁的替代方案：

const output = input1.map(name => ({
  name,
  actions: input2.filter(obj => 
    obj.name.split('.')[0] === name)
    .map(obj => obj.name.split('.')[1])
}));

假设 input2 也是一个数组。

【讨论】：