SessionStorage ve LocalStorage, anahtar / değer çiftlerini bir web tarayıcısına kaydetmenize olanak tanır. Değer bir dize olmalıdır ve js nesnelerini kaydetmek önemsiz değildir.

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

Günümüzde, nesneleri JSON'a serileştirerek ve sonra nesneleri kurtarmak için serisini kaldırarak bu kısıtlamayı önleyebilirsiniz. Ancak Depolama API'sı her zaman setItemve getItemyöntemlerinden geçer.

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

Bu sınırlamadan kaçınabilir miyim?

Sadece böyle bir şey yürütmek istiyorum:

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

Tüm özellikleri tanımlamak zorundayım ve hedefim gelecekteki özellikleri bilmek değil, çünkü çağrıları durdurmak için defineGetterve defineSetteryöntemleri denedim ama bu sıkıcı bir iş.

Web Depolama API'sı tarafından sağlanan erişimcileri kullanabilir veya bir sarıcı / bağdaştırıcı yazabilirsiniz. DefineGetter / defineSetter ile belirttiğiniz sorundan bir sargı / adaptör yazmak sizin için çok fazla iş gibi geliyor.

Size ne söyleyeceğimi bilmiyorum. Belki de "saçma bir sınırlama" hakkındaki fikrinizi yeniden değerlendirebilirsiniz. Web Depolama API'sı bir anahtar / değer deposu olması gereken şeydir.

Nesnenizi ' sessionStorage.setItem()dizgi haline getiremezsiniz' ... sonra nesnenizin dize temsilini saklamak için kullanın ... sonra ihtiyacınız olduğunda sessionStorage.getItem()ve sonra $.parseJSON()geri almak için kullanın ?

Çalışma örneği http://jsfiddle.net/pKXMa/

Çözüm sessionStorage üzerinde setItem çağırmadan önce nesneyi dizgi yapmaktır.

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

Bu, nesneler dahil tüm değer türleriyle çalışan dinamik bir çözümdür:

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

Sonra :

const session = new Session();

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

Kullanım örneği:

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

Oturum depolama keyfi bir nesneyi destekleyemiyor çünkü sayfa yeniden yüklendikten sonra yeniden oluşturulamayan işlev değişmezlerini (okuma kapanışları) içerebilir.

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

Crossbrowser yeteneğiyle sizin için gerçekleştiren mağaza kitaplığını da kullanabilirsiniz .

misal :

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

Nesneyi oturum depolama alanından kaydetmek ve almak için 2 sarıcı yöntem oluşturabilirsiniz.

function saveSession(obj) {
  sessionStorage.setItem("myObj", JSON.stringify(obj));
  return true;
}

function getSession() {
  var obj = {};
  if (typeof sessionStorage.myObj !== "undefined") {
    obj = JSON.parse(sessionStorage.myObj);
  }
  return obj;
}

Şöyle kullanın: - Nesne alın, bazı verileri değiştirin ve geri kaydedin.

var obj = getSession();

obj.newProperty = "Prod"

saveSession(obj);