Convert date in state array back to Date object

Question

I am saving state in my React app via localStorage

const [items, setItem] = useState(() => {
let itemsString = window.localStorage.getItem('items');
if (itemsString) {
  try {
    return JSON.parse(itemsString);
  } catch (e) {
    console.error(e);
    return [];
  }
} else {
  return [];
}
})

when I JSON.parse(itemsString) the date in the state has been converted to UTC (because strings/localstorage)

How do I JSON.parse() my state and reinitialize the date string to an object?

e.g. instead of returning 2019-07-19T00:28:03.058Z return Thu Jul 18 2019 20:28:03 GMT-0400 (Eastern Daylight Time) instead

Solution I came up with the help of Aaron's suggestion below.

Store old state. Map over state array, creating new empty object and storing each property in it, store date, convert date to string and pass that into new Date object to instantiate the value back to a date object on page refresh.

const [items, setItem] = useState(() => {
let itemsString = window.localStorage.getItem('items');
if (itemsString) {
  try {
    const oldState = JSON.parse(itemsString);
    const newState = oldState.map(item => {
      const date = item.date;
      const container = {} 
      container.id = item.id
      container.item = item.item
      container.date = new Date(date.toString())
      container.cost = item.cost
      container.type = item.type
      return container;
    })

    return newState;
  } catch (e) {
    console.error(e);
    return [];
  }
} else {
  return [];
}
})

Answer 1

After you parse itemString just set the date key to a new Date object

const object = JSON.parse(itemString);
const newState = {...object, date: new Date(object.date)}