I am trying to adddata from another object into a new object while also adding new data
const addCardData = { ...optIn, cardId, cardName}
here optIn already has cardId and cardName so they are getting replaced by new values, how to make an addCardData such that cardId and cardName not be replaced but added to the object or as a sub object? or is there any other better way to do this?
If your goal is to keep the values from "optIn", you could add them last.
For example:
addCardData = {
cardId,
cardName,
...optIn
};
If your goal is to add both versions of cardId and both versions of cardName, you have two options:
For example:
addCardData = {
newCardId: cardId,
newCardName: cardName,
...optIn
};
addCardData = {
cardId,
cardName,
optIn
};
Then you can refer to it by addCardData.optIn.cardId.
The main goal is just merge? I mean, merge choosing between new data or old data? Here is a sample code showing both cases:
const cardId = 999;
const cardName = "Anakin";
const optIn = {a:123, b:456, cardId:789, cardName:"Skywalker"}
console.log({ ...optIn, cardId, cardName}); // merge applying new data on cardId/cardName
console.log({ cardId, cardName, ...optIn}); // merge keeping original data on cardId/cardName
Here is a way to combine both objects. If any of the properties already exists in optIn it will be changed into an array in addCardData and the new value will then be pushed onto it:
const optIn={a:123,b:456,cardId:789,cardName:"Harry"},cardId=222,cardName="Sally";
const addCardData = {...optIn};
Object.entries({cardId,cardName}).forEach(([k,v])=>{
(addCardData[k]=Array.isArray(addCardData[k])?addCardData[k]:[addCardData[k]]).push(v)
});
console.log(addCardData);