合並 JavaScript 對象數組

Question

我正在使用 JavaScript 創建一個項目。 我正在嘗試在某些條件下將值添加到 JavaScript 對象數組中。 一切正常，我已經達到了預期的 output 但唯一的問題是代碼看起來很長。

 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)

output：

請提出更好的想法以更短的方式實現這一目標。

Answer 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)

Answer 2

將f1Response和f3Response轉換為[uuid, name]的映射。 現在map 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)