Como salvar arrays na localStorage de JavaScript

Neste artigo você vai aprender a como salvar arrays na localStorage, ou seja, guardar um dado do tipo array na storage

Fala programador(a), beleza? Bora aprender mais sobre localStorage e também JavaScript!

Basicamente precisamos entender que a localStorage só consegue ter strings salvas nela

Ou seja, precisamos converter nosso array para uma string também!

E isso é muito simples, o objeto JSON tem um método para isso o stringify

Quando obtvermos a string, podemos inserir o dado array em string na localStorage com o método setItem, do próprio objeto localStorage

Veja o exemplo a seguir:

const arr = [1,2,3];

// salvar dados
localStorage.setItem('itens', JSON.stringify(arr));

Pronto! Nosso array está lá na localStorage e se chama itens

Agora como podemos resgatar e utilizar posteriormente?

Basta resgatar com getItem de localStorage e converter novamente, com o método JSON.parse

Veja:

// resgatar os dados
const itens = JSON.parse(localStorage.getItem('itens'))

console.log(itens); // [1, 2, 3]

E assim o array que virou texto, é um array novamente e já podemos utilizá-lo!

Conclusão

Neste artigo você aprendeu a como salvar arrays na localStorage de JavaScript

Utilizamos o método stringify de JSON para transformar o array em texto, aí sim ele pode entrar na localStorage

Para resgatar o array temos que utilizar getItem e depois transformar o texto em array novamente, podemos fazer isso com parse de JSON

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias!

Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias

O link acima contém um cupom de desconto para os cursos!