Как мне сохранить массив в localStorage?

Question

Если бы я не нуждался в localStorage, мой код выглядел бы так:

var names=new Array(); 
names[0]=prompt("New member name?");

Это работает. Тем не менее, мне нужно хранить эту переменную в localStorage, и она оказывается довольно упрямой. Я пробовал:

var localStorage[names] = new Array();
localStorage.names[0] = prompt("New member name?");

Куда я иду не так?

Answer 1

localStorage поддерживает только строки. использование JSON.stringify() а также JSON.parse(),

var names = [];
names[0] = prompt("New member name?");
localStorage.setItem("names", JSON.stringify(names));

//...
var storedNames = JSON.parse(localStorage.getItem("names"));

Answer 2

localStorage а также sessionStorage может обрабатывать только строки. Вы можете расширить объекты хранения по умолчанию для обработки массивов и объектов. Просто включите этот скрипт и используйте новые методы:

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

использование localStorage.setObj(key, value) сохранить массив или объект и localStorage.getObj(key) чтобы получить это. Те же методы работают с sessionStorage объект.

Если вы просто используете новые методы для доступа к хранилищу, каждое значение будет преобразовано в JSON-строку перед сохранением и проанализировано, прежде чем оно будет возвращено получателем.

_{Источник: http://www.acetous.de/p/152}

Answer 3

Использование JSON.stringify() а также JSON.parse() как предложено нет! Это предотвращает, возможно, редкую, но возможную проблему имени члена, которое включает в себя разделитель (например, имя члена three|||bars).

Answer 4

Просто создал это:

https://gist.github.com/3854049

//Setter
Storage.setObj('users.albums.sexPistols',"blah");
Storage.setObj('users.albums.sexPistols',{ sid : "My Way", nancy : "Bitch" });
Storage.setObj('users.albums.sexPistols.sid',"Other songs");

//Getters
Storage.getObj('users');
Storage.getObj('users.albums');
Storage.getObj('users.albums.sexPistols');
Storage.getObj('users.albums.sexPistols.sid');
Storage.getObj('users.albums.sexPistols.nancy');

Answer 5

Подход JSON работает, то есть на 7 вам нужен json2.js, с ним он работает отлично и, несмотря на один комментарий, говорящий об ином, есть localStorage. это действительно кажется лучшим решением с наименьшими хлопотами. Конечно, можно написать сценарий, который будет делать то же самое, что и json2, но в этом нет особого смысла.

по крайней мере со следующей строкой версии есть localStorage, но, как уже говорилось, вам нужно включить json2.js, потому что он не включен самим браузером: 4.0 (совместимый; MSIE 7.0; Windows NT 6.1; WOW64; Trident/5.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; BRI/2; NP06; .NET4.0C; .NET4.0E; Zune 4.7) (я бы сделал этот комментарий на ответ, но не могу).

Answer 6

Другое решение было бы написать обертку, которая будет хранить массив следующим образом:

localStorage.setItem('names_length', names.length);
localStorage.setItem('names_0', names[0]);
localStorage.setItem('names_1', names[1]);
localStorage.setItem('names_' + n, names[n]);

Снимает накладные расходы на преобразование в JSON, но это раздражает, если вам нужно удалить элементы, так как вам нужно будет переиндексировать массив:)