immutably update value of a property in array of object

Question

I have this array of object

const d = [{
  a_1: 1,
  b_2: 2
}]

How can I update a_1 value to 2 without creating a temporary variable?

const myKey = 'a_1'
const myValue = 2
d.map(obj => ({...obj, obj[myKey]:myValue})) //why this won't work?

I take it `myKey` is dynamic? If so, of course, [Snow's answer](https://stackoverflow.com/a/58155137/157247) is correct, and this is covered by the answers to [this question](https://stackoverflow.com/questions/695050/add-a-property-to-a-javascript-object-using-a-variable-as-the-name). If it's *not* dynamic, just specify the property directly: `const result = d.map(obj => ({...obj, a_1: 2}));` — T.J. Crowder, Sep 29 '19 at 12:22
@T.J.Crowder a_1, will be populated to other object, how to avoid that? — user3106579, Sep 29 '19 at 12:24
@T.J.Crowder I'm stuck using the logic to update the form's state https://codesandbox.io/s/cocky-ives-cx5nx — user3106579, Sep 29 '19 at 13:13

Snow · Answer 1 · 2019-09-29T12:18:47.977

0

Remove the obj from obj[myKey] so that [myKey] is correctly seen as a computed property name.

const transformedDs = d.map(obj => ({...obj, [myKey]:myValue}))

edited Sep 29 '19 at 12:18

answered Sep 29 '19 at 12:17

Snow

1

...and store the `map` result somewhere. – T.J. Crowder Sep 29 '19 at 12:18
imagine I have few input (html), and I use above code, isn't my array will have all the [myKey]? – user3106579 Sep 29 '19 at 12:26
@user3106579 Yes, since the key will always exist in the returned object, it'll also always exist in every item in the resulting array – Snow Sep 29 '19 at 12:37
https://codesandbox.io/s/cocky-ives-cx5nx how do you update the value of this form? – user3106579 Sep 29 '19 at 13:13
there's no ```value``` property – user3106579 Sep 29 '19 at 13:21
@user3106579 Oh, you want the first (and only) value in the object, so `value={Object.values(o)[0]` (but I'd consider a different data structure, you currently have `name="[object Object"]` for both inputs too) – Snow Sep 29 '19 at 13:59

1 Answers1