javascript - objetos - guardar objeto localstorage

Guardar objetos Javascript en sessionStorage

Question

SessionStorage y LocalStorage permite guardar pares clave / valor en un navegador web. El valor debe ser una cadena y guardar objetos js no es trivial.

var user = {''name'':''John''};
sessionStorage.setItem(''user'', user);
var obj = sessionStorage.user; // obj=''[object Object]'' Not an object

Hoy en día, puede evitar esta limitación serializando objetos en JSON, y luego deserializándolos para recuperar los objetos. Pero la API de almacenamiento siempre pasa a través de los métodos setItem y getItem .

sessionStorage.setItem(''user'', JSON.stringify(user));
var obj = JSON.parse(sessionStorage.getItem(''user'')); // An object :D

¿Puedo evitar esta limitación?

Solo quiero ejecutar algo como esto:

sessionStorage.user.name; // ''John''
sessionStorage.user.name = ''Mary'';
sessionStorage.user.name // ''Mary''

He intentado con los métodos defineGetter y defineSetter para interceptar las llamadas, pero es un trabajo tedioso, porque tengo que definir todas las propiedades y mi objetivo no es conocer las propiedades futuras.

Answer 1

Caso de uso:

 sesssionStorage.setObj(1,{date:Date.now(),action:''save firstObject''});
sesssionStorage.setObj(2,{date:Date.now(),action:''save 2nd object''});
//Query first object
sesssionStorage.getObj(1)
//Retrieve date created of 2nd object
new Date(sesssionStorage.getObj(1).date)

API

Storage.prototype.setObj = function(key, obj) {
return this.setItem(key, JSON.stringify(obj))
};
Storage.prototype.getObj = function(key) {
return JSON.parse(this.getItem(key))
};

Answer 2

¿No podría ''stringify'' su objeto ... luego use sessionStorage.setItem() para almacenar esa representación de cadena de su objeto ... luego cuando lo necesite sessionStorage.getItem() y luego use $.parseJSON() para obtenerlo ¿retirarse?

Ejemplo de trabajo http://jsfiddle.net/pKXMa/

Answer 3

Esta discusión es discutible. Los diseñadores de idiomas no son idiotas. El almacenamiento de sesión no puede admitir un objeto arbitrario porque puede contener funciones (cierres de lectura) que no se pueden reconstruir después de una recarga de página.

Answer 4

Esta es una solución dinámica que funciona con todos los tipos de valores, incluidos los objetos:

class Session extends Map {
set(id, value) {
if (typeof value === ''object'') value = JSON.stringify(value);
sessionStorage.setItem(id, value);
}
get(id) {
const value = sessionStorage.getItem(id);
try {
return JSON.parse(value);
} catch (e) {
return value;
}
}
}

Entonces :

const session = new Session();
session.set(''name'', {first: ''Ahmed'', last : ''Toumi''});
session.get(''name'');

Answer 5

La solución es codificar el objeto antes de llamar a setItem en sessionStorage.

var user = {''name'':''John''};
sessionStorage.setItem(''user'', JSON.stringify(user));
var obj = JSON.parse(sessionStorage.user);

Answer 6

O puede usar los accesos proporcionados por la API de almacenamiento web o puede escribir un contenedor / adaptador. Desde su problema establecido con defineGetter / defineSetter suena como escribir un wrapper / adaptador que es demasiado trabajo para usted.

Honestamente, no sé qué decirte. Tal vez podrías reevaluar tu opinión sobre lo que es una "limitación ridícula". La API de almacenamiento web es exactamente lo que se supone que es, un almacén de claves / valores.

Answer 7

También puede usar la biblioteca de la tienda que lo realiza por usted con la capacidad de un navegador cruzado.

ejemplo:

// Store current user
store.set(''user'', { name:''Marcus'' })
// Get current user
store.get(''user'')
// Remove current user
store.remove(''user'')
// Clear all keys
store.clearAll()
// Loop over all stored values
store.each(function(value, key) {
console.log(key, ''=='', value)
})

Answer 8

 var user = {''name'':''John''};
sessionStorage[''user''] = JSON.stringify(user);
console.log(sessionStorage[''user'']);