在sessionStorage中保存Javascript对象

Question

SessionStorage和LocalStorage允许在Web浏览器中保存键/值对.该值必须是一个字符串,并且保存js对象并不简单.

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

现在,您可以通过将对象序列化为JSON,然后反序列化它们来恢复对象来避免此限制.但是Storage API总是通过setItem和getItem方法传递.

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

我可以避免这种限制吗？

我只是想执行这样的事情:

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

我曾尝试defineGetter和defineSetter方法拦截电话,但它是一个单调乏味的工作,因为我必须定义所有属性和我的目标是不知道未来的属性.

Answer 1

你能否"对字符串化"你的对象...然后sessionStorage.setItem()用来存储你的对象的字符串表示...然后当你需要它sessionStorage.getItem()然后用$.parseJSON()它来取回它？

工作示例http://jsfiddle.net/pKXMa/

Answer 2

解决方案是在sessionStorage上调用setItem之前对对象进行字符串化.

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

Answer 3

您可以使用Web Storage API提供的访问器,也可以编写包装器/适配器.从你声明的问题与defineGetter/defineSetter听起来像写一个包装器/适配器对你来说太多了.

老实说,我不知道该告诉你什么.也许你可以重新评估你对什么是"荒谬的限制"的看法.Web Storage API就是它应该是的,一个键/值存储.

Answer 4

这是一个动态解决方案,适用于所有值类型,包括对象:

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;
    }
  }
}

然后 :

const session = new Session();

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

Answer 5

使用案例:

 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))
    };