Como excluir valor da localStorage ao fechar página em JavaScript

Neste artigo você vai aprender a como excluir valor da localStorage ao fechar página em JavaScript, utilizando uma simples abordagem!

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

Para atingir o resultado que precisamos vamos precisar ativar um evento ao fechar a página

O mais indicado para este fim é o unbeforeunload

Dentro dele vamos ativar a função de remoção de itens da localStorage, que é a removeItem

Precisamos passar o nome da chave que queremos remover o valor

Um ponto de atenção importante é que o unbeforeunload precisa retornar uma string, então teremos uma linha desnecessária para atingir este pré-requisito

Veja o código completo:

window.onbeforeunload = function() {

  localStorage.removeItem("token");
  
  return '';
  
};

Neste caso estamos criando o evento e após o fechamento da página deletando o item chamado token da localStorage

E é só isso que precisamos fazer!

Note que uma melhor abordagem seria utilizar o sessionStorage, pois ele já faz isso automaticamente

Sempre que a janela/aba é fechada os valores são removidos

Conclusão

Neste artigo você aprendeu a como excluir valor da localStorage ao fechar página em JavaScript

Utilizamos o evento onbeforeunload, que é ativado ao fechar a página ou aba do navegador

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!