Объединение массива объектов JavaScript

#javascript #arrays #object #ecmascript-6

#javascript #массивы #объект #ecmascript-6

Вопрос:

Я создаю проект с использованием JavaScript. Я пытаюсь добавить значения в массив объектов JavaScript на основе определенных условий. Все работает нормально, и я достиг ожидаемого результата, но единственная проблема в том, что код выглядит очень длинным.

 let f1Response = [{
  "uuid": "1",
  "name": "f1",

}]
    
let f2Response = [{
    "name": "f2",
    "f1uuid": "1",
    "f3uuid":"3"

}]

let f3Response = [{
    "name": "f3",
    "uuid": "3",

}]
    
for(var i=0; i<f2Response.length; i  ){
  for(var j=0;j<f3Response.length; j  ){
    if(f3Response[j]['uuid'] == f2Response[i]['f3uuid']){
     f2Response[i]['f3Name'] = f3Response[j]['name']
    }
  }
} 
          
for(var ik=0; ik<f2Response.length; ik  ){
  for(var jk=0;jk<f1Response.length; jk  ){
    if(f1Response[jk]['uuid'] ==f2Response[ik]['f1uuid']){
      f2Response[ik]['f1Name'] = f1Response[jk]['name']
    }
  }
}
console.log(f2Response)  

вывод:

Пожалуйста, предложите лучшую идею для достижения этого более коротким способом.

Ответ №1:

Для этого вы можете использовать reduce .

 let f1Response = [{
  "uuid": "1",
  "name": "f1",

}]
    
let f2Response = [{
    "name": "f2",
    "f1uuid": "1",
    "f3uuid":"3"

}]

let f3Response = [{
    "name": "f3",
    "uuid": "3",

}]

f2Response = f2Response.reduce((acc, curr) => {
   const { f3uuid, f1uuid } = curr;
   
   let f3Index = f3Response.findIndex(item => item.uuid === f3uuid);
   let f1Index = f1Response.findIndex(item => item.uuid === f1uuid);
   
   const {name: f3name} = f3Response[f3Index];
   const {name: f1name} = f1Response[f1Index];
   
   acc.push({...curr, f3name, f1name,});
   return acc;
}, []);
    

console.log(f2Response) 

Ответ №2:

Преобразование f1Response и f3Response в карты [uuid, name] . Теперь сопоставьте f2Response и получите имена по их соответствующим идентификаторам uuid:

 const createNamesMap = arr => 
  new Map(arr.map(item => [item.uuid, item.name]))
  
const combine = (f1, f2, f3) => {
  const f1Map = createNamesMap(f1) // create a Map of f1 name by uuid
  const f3Map = createNamesMap(f3) // create a Map of f3 name by uuid
  
  return f2.map(item => ({
    ...item,
    f3Name: f3Map.get(item.f3uuid), // get f3 name
    f1Name: f1Map.get(item.f1uuid) // get f1 name
  }))
}

const f1Response = [{"uuid": "1","name": "f1"}]
const f2Response = [{"name": "f2","f1uuid": "1","f3uuid": "3"}]
const f3Response = [{"name": "f3","uuid": "3"}]

const result = combine(f1Response, f2Response, f3Response)

console.log(result)