Как мне сохранить массив в localStorage? [Дубликат]

471

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

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

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

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

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

  • 0
    Я опубликовал полное решение для поддержки массивов в localStorage или sessionStorage в потоке, который был закрыт как дубликат, потому что нижний поток действительно отвечает на вопрос, изначально заданный Дейвом: stackoverflow.com/a/23516713/2208713 . Надеюсь, это поможет некоторым людям.
  • 0
    Простой способ справиться с такого рода условиями, вы можете использовать библиотеку opendb, очень полную, чтобы иметь дело с массивом, объектом. Вы можете перейти по этой ссылке github.com/pankajbisht/openDB
Теги:
arrays
local-storage

6 ответов

952
Лучший ответ

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"));
Поделиться
  • 4
    JSON не поддерживается в IE7 и более ранних версиях.
  • 334
    @SaifBechan Не беспокойтесь о IE 6/7, мы говорим о localStorage
Показать ещё 9 комментариев
100

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

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

Поделиться
  • 0
    если бы вы нуждались в них всех, как бы вы их нашли?
  • 0
    Объекты хранения предоставляют свойство «длина» для определения количества сохраненных объектов и метод «ключ (int index)» для получения текущего ключа. Таким образом, вы можете попробовать: for (var i = 0; i < localStorage.length; i++) console.log( localStorage.key(i) +" has value " + localStorage[localStorage.key(i)] )
Показать ещё 4 комментария
15

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

Поделиться
  • 0
    Можете ли вы показать нам лучшую альтернативу?
  • 3
    Это не дает ответа на вопрос. Чтобы критиковать или запросить разъяснения у автора, оставьте комментарий под своим постом.
Показать ещё 4 комментария
5

Только что создал это:

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');
Поделиться
  • 3
    Это то, что я искал, за исключением того, что он будет обходить ключи предоставленного объекта и сохранять (одно) связанное значение в каждом. Большое спасибо за вдохновение.
4

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

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, но будет раздражать, если вам нужно удалить элементы, так как вам придется переиндексировать массив:)

Поделиться
  • 0
    Убивает прирост производительности не JSONifying.
  • 0
    @CamiloMartin Да, это, вероятно, правда .. :)
Показать ещё 5 комментариев
3

Подход 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) (Я бы сделал это комментарий к ответу, но не могу).

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню