Be Careful Where You Spread

The spread operator has proven to be very useful to me recently, allowing me to include all the contents of a previous dictionary (or object in JS) in a new one, while updating specific key-value pairs. Very handy for when you want to update a state used by several components.

However, be aware - it does rely on order. I recently ran into this issue, updating some state like this:

dispatch({
  type: "UPDATE",
  state: {
    date: [startDate, endDate],
    ...graphOptions,
  },
});

The issue was that the date seemingly never got updated - even though I am right?

Well yes, but then the value of date in graphOptions would then overwrite this new one due to the spread and thus nothing occurred.

So heed my warning future Josh/person on the internet - be careful where you spread.

All rights reserved © Joshua Bosman 2025