LocalStorage - проверка ключей и значения

Хотел бы узнать, можно ли как то, через цикл for проверять ключ localStorage.getItem(...) и значения
я решил попробовать сделать возврат текста, но когда я попытался сделать вывод этого самого ключа и его
значения, то не смог понять как проверять их, к примеру
for(let i = 0; i < ключ.length; i++){
out.innerHTML = ключ[i];
}
Так же и со значением, но не понимаю как их фиксировать, то есть как мне обозначить ключ и значение переменной. Скрин


Ответы (2 шт):

Автор решения: Zhyvko Roman

LocalStorage принимает только string значение, чтобы сохранить массив его сначала перевести в формат JSON, а потом можно распарсить(JSON.parse) и получить массив обратно. Сделал пример

const arr = [];

document.querySelector('#btn').addEventListener('click', (e) => {
    e.preventDefault()
    const one = document.querySelector('#one').value;
    const two = document.querySelector('#two').value;
    arr.push(one)
    arr.push(two)
    localStorage.setItem('arr', JSON.stringify(arr))
});

const newArr = JSON.parse(localStorage.getItem('arr'));

newArr.forEach((element, index) => {
    console.log(index, element)
})
        <input type="text" id="one">
        <label for="one">ONE</label>
        <input type="text" id="two" >
        <label for="two">TWO</label>
        <button id="btn">CLICK</button>

→ Ссылка
Автор решения: Aziz Umarov

Может это поможет.

for( let i = 0; i < localStorage.length; i++) { 
    console.log(`Local Storage key = ${localStorage.key(i)} value = ${ localStorage.getItem(localStorage.key(i))}`);
}
→ Ссылка