如何以分配内部对象的方式连接数组？

Question

Okay it was a bit hard to explain what I want. Let me explain in more detail. I have an array of objects. Because the "only" identifier of the arrays elements are their indexes, if we want to change an element we need to know which is the target index. But even if we have the index, I don't want to change the whole object, just assign the new one and "merge" them together.

I have a solution, which is ugly, but at least makes more sense what I want:

 const users = [ { id: 0, name: "John", hobby: "soccer" }, { id: 1, name: "Alice", hobby: "squash" }, { id: 2, name: "Greg", hobby: "guitar" } ] const newUsers = [ { id: 0, work: "developer" }, { id: 2, work: "musician" }, { id: 3, name: "Roger", work: "accountant" } ] const concatArray = (newArray, oldArray) => { const objectFromArray = array => array.reduce((object, user) => { object[user.id] = user; return object }, {}); const objectOfOldArray = objectFromArray(oldArray); const objectOfNewArray = objectFromArray(newArray); const allIds = Object.keys({...objectOfOldArray, ...objectOfNewArray}) return allIds.map(id => { const oldProps = objectOfOldArray[id] || {}; const newProps = objectOfNewArray[id] || {}; return {id, ...oldProps, ...newProps} }) } console.log(concatArray(newUsers, users)) 

It works fine, but there should be a more sufficient solution for this. I mean it's a very small operation, adding some properties to the specified objects, but my solution is too over-complicated to earn this. There should be an easier way to earn this.

Answer 1

You can try below approach of Array.forEach

 const users = [ { id: 0, name: "John", hobby: "soccer" }, { id: 1, name: "Alice", hobby: "squash" }, { id: 2, name: "Greg", hobby: "guitar" } ] const newUsers = [ { id: 0, work: "developer" }, { id: 2, work: "musician" }, { id: 3, name: "Roger", work: "accountant" } ] let updatedUsers = {}; [...users, ...newUsers].forEach(d => updatedUsers[d.id] = { ...(updatedUsers[d.id] || {}), ...d }) console.log(Object.values(updatedUsers))