原文地址
如何根據key合并陣列中的物件(已同步到npm lm-public-js 中)
專案中經常會遇到,array內包含object這個格式的json 需要我們根據一個key去合并其中的物件,一般是 id
效率最低的方法是 回圈套回圈,找到一致id的,然后添加到其中一個array內
比較好的方法 是把這個id對應的object 暫存一個obj內,比如 obj[item.id] = {...item,...item2}
最后根據 Object.values() 方法 重新轉化為陣列
function mergeArrAndObj(data1 = [],data2 = [],key){
if(!(data1 instanceof Array || data1 instanceof Object)) return console.warn('第一個引數格式不對')
if(!(data2 instanceof Array || data2 instanceof Object)) return console.warn('第二個引數格式不對')
if(!((data1 instanceof Array && data2 instanceof Array) || (data1 instanceof Object && data2 instanceof Object))) return console.warn('資料型別不一致')
//都為陣列的情況
if( data1 instanceof Array){
if(typeof key !== 'string') return console.warn('第三個引數 key 應為字串')
if(!key.length) return console.warn('第三個引數 key 長度不應為空')
if(typeof key === 'undefined') return console.warn('請傳入第三個引數 key')
//找出最長的陣列
let maxArr = data1.length > data2.length ? data1:data2
//找出最長的陣列
let minArr = data1.length < data2.length ? data1:data2
//臨時存放資料的陣列
let sumArr = []
//臨時存放資料的物件
let obj = {}
maxArr.forEach((item,index)=>{
//此時短的那一個陣列已經回圈完了
if(minArr[index] === undefined){
//只需要處理較長的那個陣列
return obj[item[key]] = {...maxArr[index]}
}
//這里是短的那一個陣列還沒回圈完的情況
obj[item[key]] = {...maxArr[index],...minArr[index]}
})
sumArr = Object.values(obj)
return sumArr
}else{
//都為物件
//此處為淺合并 key一致會被替換
return {...data1,...data2}
}
}
簡單測驗一下
mergeArrAndObj([{id:2,c:2}],[{id:2,a:2},{id:3,a:3}],'id')
[
{id:2,c:2,a:2},
{id:3,a:3}
]
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/242277.html
標籤：JavaScript
上一篇：webpack之require.context實作前端工程自動化
下一篇：vue3和vue2生命周期的對比