Al guardar en localStorage, use JSON.stringify (ya que Storage solo acepta valores de cadena):

 const myData = {some: "data", other: "stuff"}; localStorage.appData = JSON.stringify(myData);

Al leer desde localStorage, use JSON.parse :

 const myData = JSON.parse(localStorage.appData || "{}"); console.log(myData); // {some: "data", other: "stuff"}

¡No tenga miedo de las comillas dobles escapadas con barra invertida! De lo contrario, terminaría en un formato de cadena no válido

 const test = "this is \"something\""; // properly escaped quotes

Acostúmbrese a ver en la consola (en LocalStorage) las cadenas escapadas utilizadas para las propiedades Keys os String de un objeto literal de cadena JSON:

 "{\"prop\": \"some value\"}" // Valid stringified JSON

Perfectamente bien.

Obtenga más información sobre el formato JSON .
JSON, para que sea válido, sus claves deben estar entre comillas dobles. JSON.stringify se encargará de agregar comillas a las claves literales de un objeto JS por usted.

Como han señalado otros, las cosas no salen según lo planeado porque está encadenando localStorage en sí mismo, así como encadenando y analizando incorrectamente sus datos.

Sería mucho más fácil simplemente guardar el objeto directamente en localStorage y luego recuperarlo según sea necesario, sin tener que jugar con cadenas y análisis. Si bien estos métodos son necesarios, todo lo que logran es convertir sus datos al formato utilizable por localStorage de todos modos, pero los datos en sí permanecen convertidos, es decir, un flotante 122.55 se convierte en una cadena "122.55" y permanece así.

¿No sería mucho más fácil si pudiera almacenar directamente el número 122.55 y recuperarlo también de esa manera?

Eche un vistazo a localDataStorage , donde puede configurar/obtener de forma transparente cualquiera de los siguientes "tipos": matriz, booleano, fecha, flotante, entero, nulo, objeto o cadena. Convierte sin problemas sus datos, los almacena y le permite recuperarlos tal como fueron. Guarda un objeto y recupéralo. Guarda una fecha y recupérala. Almacene un número o un valor booleano y recupérelos.

Ejemplos:

 localDataStorage.set( 'key1', false ); localDataStorage.get( 'key1' ); --> false (boolean) localDataStorage.set( 'key2', 122.55 ); localDataStorage.get( 'key2' ); --> 122.55 (float) var obj = { id: '159e17e9-19b7-453d-8e10-a411c7424586', groups: '000e17e9-19b7-453d-8e10-a411c7424500' } localDataStorage.set( 'key3', obj ); localDataStorage.get( 'key3' ); --> {id: '159e17e9-19b7-453d-8e10-a411c7424586', groups: '000e17e9-19b7-453d-8e10-a411c7424500'} (object) localDataStorage.set( 'key4', "this is \"something\"" ); localDataStorage.get( 'key4' ); --> 'this is "something"' (string)

Todo el trabajo de conversión se realiza en segundo plano para usted: simplemente configure/obtenga y listo.

[DESCARGO DE RESPONSABILIDAD] Soy el autor de la utilidad [/DESCARGO DE RESPONSABILIDAD]

Cuando obtiene un objeto encadenado y desea que vuelva a convertirse en un objeto, hay otro comando para hacerlo

 JSON.parse(obj) 

 var obj = { id: '159e17e9-19b7-453d-8e10-a411c7424586', groups: '000e17e9-19b7-453d-8e10-a411c7424500' } var stringfiedObject = JSON.stringify(obj) console.log(stringfiedObject) var objectFromStringfiedObject = JSON.parse(stringfiedObject) console.log(objectFromStringfiedObject)