Можно ли сохранить свойство объекта в массив localStorage?

Question

[Артем Прохоров]

Есть массив table = [] для кеша, в него я хочу добавлять данные вида key: obj.
Дело в том, что метод push() действительно добавляет объект к концу массива, но он нумерует ключи по порядку.
Мне это не подходит, так как я должен знать к чему обращаться. Если использовать push({ key: value }), то тут аж 2 проблемы
1)key не принимает значение переменных, а статично задать условно "myValue": value я не могу, так как у всех свойств будут одинаковые ключи.
2)Да и в этом случаи, если я впишу туда постоянное значение текстом(test допустим), то получится вот такая вот вложенность:

6:
test: Object
items: (...)
_links: (...)
_meta: (...)

То есть и название постоянное, что уже как бы мимо, так еще толку то от него, если обращаться придется к шестерке.

А вот если добавлять через:
state.table[window.location.href] = value;
То оно добавляется в массив, но, барабанная дробь... в localStorage оно не записывается. Как это исправить?

Comments

[Lynn «Кофеман»]

Таки почему это массив, а не объект?

[Артем Прохоров]

Lynn «Кофеман», А есть разница? что так обьявить a = {}, что так a = [], console.log все равно скажет, что это обьект

[Сергей Соколов]

в localStorage оно не записывается

покажите код, которому сие не удаётся

[Lynn «Кофеман»]

kotcich, есть огромная разница

[Артем Прохоров]

Вот массив table: [],
Когда я захожу на страницу происходит вот это:

this.$store.dispatch('SAVE_TABLE', [window.location.href, data]);

Это для Vuex, передаю массивом ключ и саму data.

А вот собственно сам код сохранения:

SET_TABLE: (state, payload) => {
        state.table[payload[0]] = payload[1];
        // state.table = [];
    },

И знаете что? Он действительно сохраняет ключ и значение в массиве после перезахода, но localStorage показывает, что он пустой, это раз, во вторых напрямую обратится я не могу, просто undefined выведет.
А вот если обратится не к ключу, а массиву, вот так
console.log(this.$store.getters.TABLE);
Тогда да, ключ и значения там будут. Я уже ничего не понимаю.

Answer 1

[Сергей Соколов]

key не принимает значение переменных

Принимает.

const arr = [];

const key = "xxx";
const value = "yyy";

// подробно:
const item = {};
item[key] = value; 

// или покороче:
const item = {[key]: value};

// в массив
arr.push(item);
arr // [{xxx: "yyy"} ]

запись в LS

const lsKey = "mytable";

// Сохранить в LS:
localStorage.setItem(lsKey, JSON.stringify(arr));

// Получить из LS:
const arr = JSON.parse(localStorage.getItem(lsKey)) || [];

Upd. в общем, объявляйте не массив, а объект:

state.table = {}; // не квадратные, а фигурные

state.table[url] = value;

P.S. Да, массив — это объект, и можно ему поназначать левых свойств. Но это плохо. Хотя бы потому, что при сериализации в JSON все левые свойства пропадут:

const arr = [];     // массив! Но «в JS всё — объект»
arr.X = "Y";        // можем себе позволить!
console.log(arr.X); // "Y" ура-а, хакнули JavaScript!

JSON.stringify(arr) // [] - пустой массив, облом.

Comments

[Артем Прохоров]

И толку если все равно получается вот это:

0: {http://localhost:8080/menu/5/1: {,…}}
1: {http://localhost:8080/menu/5/1: {,…}}

Мне нужно, чтобы localhost:8080/menu/5/1 был вместо нолика, а вместо localhost:8080/menu/5/1 были данные.
Я же написал, что вложенность мне не нужна.

[Сергей Соколов]

kotcich, тогда вы не разобрались, что такое массив, и что такое объект. Массив вам не подходит. push() вам не подходит.

[Артем Прохоров]

В общем я дурачек, разобрался что к чему, огромное спасибо. Мне наверное выспаться нужно)

Answer 2

[Алексей Ярков]

А мы код записи в LS увидим?
На всякий случай напоминаю, что хранить там получится только строки.