В этой небольшой статье научимся сохранять массивы и объекты JavaScript в локальном хранилище браузера – HTML5 localStorage.
В этой небольшой статье научимся сохранять массивы и объекты JavaScript в локальном хранилище браузера – HTML5 localStorage.
Сохранение массива в localStorage
HTML5 localStorage позволяет хранить пары данных ключ/значение. И ключ, и значение должны быть строками.
Чтобы сохранить массив в объекте localStorage в виде пары ключ/значение, необходимо закодировать массив в строку JSON. И при извлечении, соответственно, нужно декодировать его обратно в массив.
Вот пример кода:
let array = [1, 2, 3];
localStorage.setItem(array, JSON.stringify(array));
array = JSON.parse(localStorage.getItem("array"));
console.log(typeof array); // объект
console.log(array); // [1, 2, 3]
Сохранение объекта в localStorage
Чтобы сохранить объект как пару ключ/значение, необходимо, также как и массив, закодировать объект в строку JSON. И при извлечении нужно декодировать его обратно в объект.
Вот пример:
var object = {
x: 12,
y: 56
}
localStorage.setItem ("object", JSON.stringify("object"));
object = JSON.parse (localStorage.getItem ("object"));
console.log(typeof object); // объект
console.log(object); // Объект {x: 12, y: 56}
