В предыдущем уроке я уже писал о том, что в локальном хранилище можно хранить только строки. Однако, есть возможность хранить массивы и объекты - для этого просто можно использовать формат JSON.
Давайте сохраним массив:
let arr = [1, 2, 3, 4, 5];
localStorage.setItem('arr', JSON.stringify(arr));
А теперь получим его обратно:
let str = localStorage.getItem('arr');
let res = JSON.parse(str);
Даны инпуты и кнопка. По нажатию на кнопку получите тексты всех инпутов в виде массива и сохраните этот массив в локальное хранилище.
Модифицируйте предыдущую задачу. Сделайте так, чтобы при следующем заходе на страницу в инпутах стояли сохраненные в локальном хранилище значения.
Модификация хранимых структур
Пусть в локальном хранилище хранится некоторый массив:
let arr = [1, 2, 3, 4, 5];
localStorage.setItem('arr', JSON.stringify(arr));
Пусть теперь нам понадобилось как-то модифицировать этот массив, например, добавить ему в конец еще один элемент или изменить уже существующий.
Для решения задачи получим хранящуюся в хранилище строку с массивом, преобразуем эту строку в массив, проделаем с этим массивом необходимые манипуляции, преобразуем этот массив обратно в строку и запишем назад в хранилище:
let str = localStorage.getItem('arr');
let arr = JSON.parse(str);
arr.push(6);
arr[0] = '!';
localStorage.setItem('arr', JSON.stringify(arr));
Дан следующий массив с юзерами:
let users = [
{
surname: 'surname1',
name: 'name1',
age: 31,
},
{
surname: 'surname2',
name: 'name2',
age: 32,
},
{
surname: 'surname3',
name: 'name3',
age: 33,
},
];
Сохраните его в локальное хранилище. Затем
сделайте 3 инпута и кнопку. Пусть
в инпуты вводятся фамилия, имя и возраст.
По нажатию на кнопку запишите нового юзера
в конец сохраненного в хранилище массива.