Trabalhando com Local e Session Storage no Javascript — Encapsulando e reutilizando
Pegando uma explicaçao rápida no StackOverflow do que seria cada um, temos https://pt.stackoverflow.com/questions/19384/diferen%C3%A7as-entre-localstorage-vs-sessionstorage
Ambos localStorage e sessionStorage se extendem de Storage. Não há diferença entre eles, exceto para a não-persistência de sessionStorage.A não-persistência como descrito acima é no sentido de que sessionStorage se faz disponível apenas para a janela que criou os dados até que tal janela seja fechada, ao abrir outra janela(ou aba) tais dados não estarão disponíveis.Em contrapartida de sessionStorage, ao criar dados em localStorage esses dados estarão disponíveis para qualquer aba/janela mesmo que o usuário encerre a janela, reinicie o sistema, etc.Um exemplo, vamos supor que você deseja salvar o nome de usuário e senha para realizar um login, é provável que você opte por armazenar esses dados em sessionStorage por motivos de segurança e salvar as configurações de usuário em localStorage.
Sabendo do que se trata cada um, decidi criar uma classe default para utilização em todos os componentes e classes da minha aplicação, ficando encapsulado e se eu precisar mudar o formato de storage futuramente, ele poderei alterar num único lugar.
Eu inicializo com a variável setando qual storage eu vou utilizar por padrão, defino os métodos que faz o que cada nome já diz respectivamente… Buscar, adicionar, atualizar, remover, limpar tudo e setar o tipo do storage.
E para chamada, é só importar o arquivo criado e chamar os métodos, exemplo:
import Cache from 'cache.js'// pode ser utilizado em qualquer framework,
// dentro de qualquer metodo, chamando:Cache.get("NOME_DA_CHAVE");let meuObjeto = {};
Cache.add("NOME_DA_CHAVE", JSON.stringify(meuObjeto));Cache.reset();
Por padrão está se inicializando como localStorage, mas logo depois de importar a classe, você pode chamar o setStorage para modificar o meio, ou implementar até outro componente ou plugin de storage.
Cache.setStorage("SESSION");Na mesma ideia, veja também: