I am trying to conditionally add members to an object using the method prescribed here
Here is my code:
const theobj = {
field1: "hello",
field2: 1,
data: {
datafield1: "world",
datafield2: 2
},
field3: "yowzee"
};
let someobj: any;
someobj = theobj;
const test = {
...(someobj.field1 && {field1: someobj.field1}),
...(someobj.nofield && {nofield: "yowzee"}),
...(someobj.data?.datafield1 && {data: {dataField1: "woohoo"}}),
...(someobj.data?.datafield2 && {data: {datafield2: "hooahh"}}), // overwrites the above
};
console.log(test);This works great except that the last conditional overwrites data.datafield1. Its as if it re-creates the inner data objects. Any ideas how to resolve this?
In that last line, you're setting the data property of the object to a new object, {datafield2: "hooahh"}.
That would be the equivalent of:
{
data: { a: 1 }
data: { b: 2 }
}
duplicate keys are overriden, so it becomes
{
data: { b: 2 }
}
If you want to set data to a single object with conditional sub-keys of its own, you can do:
const test = {
...(someobj.field1 && {field1: someobj.field1}),
...(someobj.nofield && {nofield: "yowzee"}),
...(someobj.data && {data: {
...(someobj.data.datafield1 && {dataField1: "woohoo"}),
...(someobj.data.datafield2 && {dataField2: "hooahh"}),
}}),
};
Yes, it's happening exactly what you're thinking, this is why you need a reference from a previous value of the data object.
const test = {
...(someobj.field1 && { field1: someobj.field1 }),
...(someobj.nofield && { nofield: "yowzee" }),
...(someobj.data.datafield1 && { data: { dataField1: "woohoo" }}),
...(someobj.data.datafield2 && { data: { ...someobj.data, datafield2: "hooahh" }}), // doesn't overwrites the above.
};
By spreading someobj.data inside of itself, you are ensuring that it has his previous value.