简体   繁体   English

localStorage:以不同的方式存储对象与简单数据类型?

[英]localStorage: Storing Objects vs Simple Data Types in different ways?

I've seen the approach of using JSON.stringify and JSON.parse to store and retrieve values/objects from HTML5 localStorage. 我已经看到了使用JSON.stringify和JSON.parse从HTML5 localStorage存储和检索值/对象的方法。 It works, but it "stringifies" everything - including strings, numbers, etc. I'd like to improve it. 它可以工作,但是可以对所有内容都“字符串化” ,包括字符串,数字等。我想对其进行改进。 I'd like to avoid "stringifying" simple data types that are not objects. 我想避免“字符串化”不是对象的简单数据类型。 I've got a method below that I use to determine if a parameter is an object and JSON.stringify it if it is an object. 我下面有一个方法,可用于确定参数是否为对象,并通过JSON.stringify将其作为对象。

lsSet: function(key, value) {

  ((Object.prototype.toString.call(value) === '[object Object]')) 
    ? localStorage.setItem(key,JSON.stringify(value)) 
    : localStorage.setItem(key,value);
  return (localStorage.getItem(key)) ? true : false;
},

Is there a good way to identify if a localStorage string you are retrieving is a stringified object? 有没有一种很好的方法来识别您要检索的localStorage字符串是否是字符串化的对象? I was thinking of checking if the string starts with { and ends with }, but it seems like there must be a better approach. 我当时正在考虑检查字符串是否以{开头和以}结尾,但是似乎必须有一个更好的方法。 Below is my current localStorage get method, but throws errors when trying to JSON.parse simple data types such as string. 下面是我当前的localStorage get方法,但是尝试使用JSON.parse简单数据类型(例如字符串)时会引发错误。

lsGet: function(key) {
    return JSON.parse(localStorage.getItem(key));
},

Typical console error is due to to the JSON.parse: 典型的控制台错误是由于JSON.parse:

Uncaught SyntaxError: Unexpected token E 

Any ideas? 有任何想法吗? A thought just came to mind, maybe just a try/catch? 想到一个想法,也许只是尝试/抓住?

var value;
try {
  value = JSON.parse(localStorage.getItem(key));
} catch(err) {
  value = localStorage.getItem(key);
}
return value;

Edit: Note, I'm juggling a lot of different data around and I don't really want to have to worry about the typeof data I'm setting/getting. 编辑:注意,我在处理很多不同的数据,我真的不想担心我要设置/获取的数据类型。 Thus stardard lsSet/lsGet methods were created. 这样就创建了stardard lsSet / lsGet方法。 In my app, data is stored in PHP Session, JavaScript Objects and localStorage - a bit of a mix. 在我的应用程序中,数据存储在PHP Session,JavaScript Objects和localStorage中-有点混合。

There's no way to know whether a string your retrieve is intended to be a serialized object or a plain string, except based on your own rules . 除了基于您自己的规则之外 ,无法知道您检索的字符串是序列化对象还是纯字符串。 The strings "null" , "34" , "[1,2,3]" could all be valid strings or valid JSON, and unless you have an idea of expected content there is no way to be sure. 字符串"null""34""[1,2,3]"都可以是有效字符串或有效JSON,并且除非您对预期的内容有所了解,否则无法确定。

So I'd suggest either: 所以我建议:

  • Serialize and deserialize everything. 序列化和反序列化所有内容。 This shouldn't be too bad performance-wise unless you're doing it at very high frequencies (in which case maybe localStorage is the wrong choice). 除非您在非常高的频率下进行,否则这在性能方面应该不会太差(在这种情况下,localStorage是错误的选择)。

OR 要么

  • Add a custom "header" to your serialized strings, eg "JSON:{...}" . 在序列化的字符串中添加自定义“标头”,例如"JSON:{...}" Then, when you retrieve a string, check for the header and process accordingly. 然后,当您检索字符串时,请检查标题并进行相应处理。
lsSet: function(key, value) {
  switch(typeof value){
      case "string" : localStorage.setItem(key,'"' + value + '"'); break;
      case "number" : localStorage.setItem(key,value); break;
      case "object" : localStorage.setItem(key,JSON.stringify(value)); break;
  }
  return (localStorage.getItem(key)) ? true : false;
},

just an idea not tested 只是一个未经测试的想法

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM