javascript - 有条件地映射对象数组

Question

我有两个对象数组，我需要在 listOfRegistries.Id === listOfTargets.regId 的新数组中引入名称

  this.listOfRegistries = [
            { id: '123', name: 'name1' },
            { id: '245', name: 'name2' },
           
        ];

this.listOfTargets =  [
            { regId: '123',key: 'value1' },
            { regId: '245', key: 'value2' },
           
        ];

我需要实现这一点：

this. listOfTargetsNew =  [
            { regId: '123',key: 'value1', name: 'name1' },
            { regId: '245', key: 'value2', name: 'name2' },
           
        ];

这就是我正在尝试但没有结果

this.listOfTargetsNew = this.listOfTargets.map((el, index)=> {
                         if( this.listOfRegistries[index].id === el.regId) {
                             el['name'] = this.listOfRegistries[index].name;
                             return el;
                          }
                         });

非常感谢您的回复。

Answer 1

您可以轻松地映射数组并通过find方法找到正确的名称。

const listOfRegistries = [
  { id: '123', name: 'name1' },
  { id: '245', name: 'name2' },
];

const listOfTargets = [
  { regId: '123',key: 'value1' },
  { regId: '245', key: 'value2' },
];

const listOfTargetsNew = listOfTargets.map((obj) => {
  const registry = listOfRegistries.find(({ id }) => id === obj.regId);
  
  return {...obj, name: registry.name};
});

console.log(listOfTargetsNew);

Answer 2

您可以将注册表存储在一个对象中，并使用附加属性映射另一个数组。

const
    listOfRegistries = [{ id: '123', name: 'name1' }, { id: '245', name: 'name2' }],
    listOfTargets = [{ regId: '123', key: 'name1' }, { regId: '245', key: 'name2' }],
    registries = Object.fromEntries(listOfRegistries.map(({ id, name }) => [id, name])),
    listOfTargetsNew = listOfTargets.map(o => ({ ...o, name: registries[o.regId] }));

console.log(listOfTargetsNew);

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