将两个数组合并到多个对象答案

【问题标题】：Merge two arrays to multiple objects将两个数组合并到多个对象
【发布时间】：2021-08-17 01:26:21
【问题描述】：

我已经有一个对象，它有两个数组：

const services = {
        iconAndLink: [
            'Icon1',
            'Icon2',
            'Icon3',
        ],
        name: [
            'Name1',
            'Name2',
            'Name3',
        ],
    };

我查看了 Object.assign()、array.reduce()、map 等...似乎无法在这里找到一个合适的答案来合并这两者。

我需要的最终结果：

services = [
        {
            icon: 'Icon1',
            name: 'Name1'
        },
        {
            icon: 'Icon2',
            name: 'Name2'
        },
        {
            icon: 'Icon3',
            name: 'Name3'
        },
    ]

请注意，我需要有 icon 和 name 键。

这在 js 中甚至可能吗？

【问题讨论】：

是的，这是可能的。但是，这两个数组的长度是否总是相同的？
这个帖子有帮助吗？ stackoverflow.com/questions/39127989/…
@CroogQT 看到这里有一个静态键。只是名称和图标。
你不能对源和结果使用相同的变量services，因为它被声明为const。
你为什么不能用map()做呢？

标签： javascript arrays javascript-objects

【解决方案1】：

这应该可以工作

const services = {
  iconAndLink: ["Icon1", "Icon2", "Icon3"],
  name: ["Name1", "Name2", "Name3"],
};

let result = services.iconAndLink.map(function (icon, index) {
  return { icon: services.iconAndLink[index], name: services.name[index] };
});


console.log(result);

确保两个数组的长度相同并且都是有序的

【讨论】：

@Kinglish 用 forEach 发布了这个。这与使用地图有什么不同？
两者相似，但不同。 Map 更多的是函数式的方式，并创建一个新的数组。 forEach 允许您更改原始数组。 map 函数将接收一个函数，该函数将在数组上的每个项目上运行并创建一个包含所有已创建对象的新数组。您可以在此处阅读更多内容developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… 对于性能点，map 稍快（如此处所示：morioh.com/p/b2d058745cb8）

【解决方案2】：

使用index 的简单forEach 循环就可以解决问题

const services = {
  iconAndLink: [
    'Icon1',
    'Icon2',
    'Icon3',
  ],
  name: [
    'Name1',
    'Name2',
    'Name3',
  ],
};

let newarray = [];
services.iconAndLink.forEach((el, index) => newarray.push({
      icon: el,
      name: services.name[index]
    })
    );

    console.log(newarray)

【讨论】：

【解决方案3】：

const services={iconAndLink:["Icon1","Icon2","Icon3"],name:["Name1","Name2","Name3"]};
    
const res = services.name.map((e, i) => ({
  icon: e,
  name: services.iconAndLink[i]
}))

console.log(res)

【讨论】：

【解决方案4】：

假设数组大小相同，您可以这样做：

const services = { iconAndLink: [ 'Icon1', 'Icon2', 'Icon3', ], name: [ 'Name1', 'Name2', 'Name3', ], };
const newArr = [];

for (let i = 0; i < services.iconAndLink.length; i++) {
    newArr.push({icon: services.iconAndLink[i], name: services.name[i]})
}

console.log(newArr)

【讨论】：