javascript HTML5 本地存储 JSON 多个对象

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10347265/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 09:33:38  来源:igfitidea点击:

HTML5 local storage JSON multiple objects

javascripthtmllocal-storage

提问by Simon Thomsen

Does anyone know, if it's possible to make a local storage with multiple objects in it when I'm doing a loop in javascript?

有谁知道,当我在 javascript 中进行循环时,是否可以创建一个包含多个对象的本地存储?

At the moment my code looks like this:

目前我的代码如下所示:

var albums = '';
var album_list = '';

$.each(data, function(i,item){
   var name = item.name;
   albums += '<li>'+item.name+'</li>';

   var album_content = {name: item.name, uid: 1};
   var album_content = album_content+',';

   album_list += album_content;


});

var album_list = '['+album_list+']';   
localStorage.setItem("albums", JSON.stringify(album_list));
var albums_l = JSON.parse(localStorage.getItem("albums"));

$.each(albums_l, function(i,item){
   console.log(item.name);
});

But that gives me an error. Anyone have a better solution for this, so I just have one localstorage and all the data in that?

但这给了我一个错误。任何人都有更好的解决方案,所以我只有一个本地存储和其中的所有数据?

回答by Sirko

You're mixing objects and strings in your code. Your album_contentis initialized in the loop as an object ({name: item.name, uid: 1}). In the very next line you treat it as a string by appending a comma.

您在代码中混合了对象和字符串。您album_content在循环中被初始化为一个对象 ( {name: item.name, uid: 1})。在下一行中,通过附加逗号将其视为字符串。

Overall use an array to collect all your objects. It's (almost) always better to use the native objects instead of trying to emulate them in some way.

总体而言,使用数组来收集所有对象。使用原生对象(几乎)总是更好,而不是尝试以某种方式模拟它们。

Try this code instead.

试试这个代码。

var albums = '';
var album_list = [];

$.each(data, function(i,item){
   var name = item.name;
   albums += '<li>'+item.name+'</li>';

   var album_content = {name: item.name, uid: 1};
   // remove that line completly
   // var album_content = album_content+',';

   album_list.push( album_content );

});


localStorage.setItem("albums", JSON.stringify( album_list ));
var albums_l = JSON.parse(localStorage.getItem("albums"));

$.each(albums_l, function(i,item){
   console.log(item.name);
});

回答by noob

What's wrong:

怎么了:

var albums = '';
var album_list = '';

$.each(data, function(i,item){
   var name = item.name;
   albums += '<li>'+item.name+'</li>';

   var album_content = {name: item.name, uid: 1};

   // at this point album_content is an object.. so it will be this string afterwards: "[object Object],"
   var album_content = album_content+',';

   album_list += album_content; //you're adding "[object Object],"


});

// album_list will now look like this: '["[object Object],[object Object],"]'
var album_list = '['+album_list+']';
localStorage.setItem("albums", JSON.stringify(album_list));
var albums_l = JSON.parse(localStorage.getItem("albums"));

$.each(albums_l, function(i,item){
   console.log(item.name);
});

How to do it correct:

正确做法:

var albums = '';
var album_list = [];

$.each(data, function(i,item){
   var name = item.name;
   albums += '<li>'+item.name+'</li>';

   var album_content = {name: item.name, uid: 1};

   album_list.push(album_content);


});

localStorage.setItem("albums", JSON.stringify(album_list));
var albums_l = $.parseJSON(localStorage.getItem("albums"));

$.each(albums_l, function(i,item){
   console.log(item.name);
});