Как извлечь конкретные значения из данных localStorage с помощью JavaScript

Оффтоп javascript
1

Проблема с обработкой данных из localStorage

У меня есть данные, которые сохраняются в localStorage.data и выглядят так:
[{"site_name":"yandex","active":true},{"site_name":"mail","active":true},{"site_name":"rambler","active":true}]

Я пытаюсь достать только значения site_name, используя такой код:

var savedData = localStorage.data;
var results = savedData.map(function(item) {
    return item.site_name;
});

Но этот код не работает и не выдает никакого результата. Однако если я напишу данные вручную:

var savedData = [{"site_name":"yandex","active":true},{"site_name":"mail","active":true},{"site_name":"rambler","active":true}];
var results = savedData.map(function(item) {
    return item.site_name;
});

То получаю нужный результат: ["yandex", "mail", "rambler"]

Мне нужно использовать именно localStorage.data, потому что эти данные меняются в зависимости от действий пользователя. Подскажите, в чем может быть проблема?

2

Точно такая же проблема была у меня месяц назад! localStorage сохраняет все как строку, поэтому твой массив превратился в текст. Добавь JSON.parse() перед использованием map:

var savedData = JSON.parse(localStorage.data);
var results = savedData.map(function(item) {
    return item.site_name;
});

Только проверь, что localStorage.data не пустой, а то может ошибка вылететь при парсинге.

3

Проверь в консоли что показывает localStorage.data - может там undefined или null? Оберни JSON.parse в try-catch, если данные повредятся. И лучше используй localStorage.getItem('data') вместо прямого обращения.

4

localStorage хранит данные как строку, не объект. Сначала распарси JSON: var savedData = JSON.parse(localStorage.data); — потом уже используй map. localStorage всегда возвращает строку, а map работает только с массивами.