我有兩個陣列物件，如下所示：
person: {
0: {
firstName: John
lastName: Doe
avatar: https://sitename.com/filename.jpg
},
etc..
}
image: {
0: {
Key: filename.jpg
files: {
srcSet: 'filename.jpg 256w'
}
}
}
我的目標是通過找到的值avatar與in中的值Key匹配物件，并在匹配后將陣列的物件合并到一個新的陣列結構中，如下所示：
person: {
0: {
firstName: John
lastName: Doe
avatar: https://sitename.com/filename.jpg
Key: filename.jpg
files: {
srcSet: 'filename.jpg 256w'
}
},
etc..
}
我的直覺告訴我某種.filter并.map鏈接到過濾器可以幫助創建新的物件陣列，但是，我不確定如何匹配部分值。
uj5u.com熱心網友回復：
你可以通過呼叫做這樣的事情Array.prototype.map()上Object.entries(yourobject)
在原始物件的鍵和值陣列上呼叫 map 后，您可以檢查第二個物件中是否存在具有相同鍵的元素，如果它確實使用擴展運算子創建具有組合屬性的新結果物件，然后把它返還
const person = {
0: {
firstName: "John",
lastName: "Doe",
avatar: "https://sitename.com/filename.jpg"
},
}
const image = {
0: {
Key: "filename.jpg",
files: {
srcSet: 'filename.jpg 256w'
}
}
}
const val = Object.entries(person).map(([k, v]) => {
const found = Object.entries(image).find(x => x[0] == k);
if (found)
return {...v, ...found[1] };
else
return {...v}
})
console.log(val);uj5u.com熱心網友回復：
你不能在物件上使用 map，但你可以使用 Object.values(object) 來獲取它的值
const person = {
0: {
firstName: "John",
lastName: "Doe",
avatar: "https://sitename.com/filename.jpg"
},
}
const image = {
0: {
Key: "filename.jpg",
files: {
srcSet: 'filename.jpg 256w'
}
}
}
const getPersonImageKey = (person) => {
return person.avatar.split("/").at(-1);
}
const mergedObjs = Object.values(person).map(person => {
const relatedImage = Object.values(image).find(image => image.Key === getPersonImageKey(person));
return {...person, ...relatedImage};
})
const finalObj = {};
mergedObjs.forEach((obj, idx) => finalObj[idx] = obj);
console.log(finalObj);轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/346438.html
標籤：javascript 数组 反应 目的