score:2

Accepted answer

Option 3 and opntion 4 are incorrect, the prevState/myState is an array and you are returning an object, this will surely cause error in typescript. As to option 1 and 2, they only differ between declaritive and imperitive way of programming. And declaritive programming makes more readable code.

On option 1:

const newState = [...myState];
newState[index].description = "new desc"; 
// Access index position as opposed to id
// since the item's position may not align with it's id
setState(newState );

On option 2 with map function, it can be written as follows:

setState(myState.map(item => item.id === id ? {...item, item.description: "new desc"} : item))

In conclusion, use map/filter is more preferable to update array.

Here's sandbox to compare option 1 and 2


Related Query

More Query from same tag