Como verificar se um item de armazenamento está definido?

288

Como posso verificar se um item está definido localStorage? Atualmente estou usando

if (!(localStorage.getItem("infiniteScrollEnabled") == true || localStorage.getItem("infiniteScrollEnabled") == false)) {
    // init variable/set default variable for item
    localStorage.setItem("infiniteScrollEnabled", true);
}
Jiew Meng
fonte
2
parece, você terá um problema sem uma exclusão mútua de armazenamento
4esn0k

Respostas:

506

O getItemmétodo na especificação WebStorage retorna explicitamente nullse o item não existir:

... Se a chave fornecida não existir na lista associada ao objeto, esse método deverá retornar nulo. ...

Então você pode:

if (localStorage.getItem("infiniteScrollEnabled") === null) {
  //...
}

Veja esta pergunta relacionada:

CMS
fonte
1
Você poderia adicionar seu próprio método localStoragepara encapsular este pequeno teste? Por exemplo localStorage.hasItem("infiniteScrollEnabled")?
Paul D. Waite
4
@ Paul: Sim, você pode até aumentar o Storage.prototypeobjeto, mas, como regra geral, eu sempre recomendo não modificar objetos que você não possui , especialmente objetos de host.
CMS
ooh sim, bons pontos lá. Vindo de um background em CSS, a idéia de que eu posso corrigir problemas do navegador é emocionante, mas posso ver como mexer nos objetos do navegador pode ficar confuso.
Paul D. Waite
5
A nota está incorreta - a versão atual da Storageinterface diz especificamente que os valores são do tipo DOMString. w3.org/TR/webstorage/#the-storage-interface
Alnitak
1
Nota removida. Obrigado @ TimothyZorn e Alnitak
CMS /
45

Você pode usar o hasOwnPropertymétodo para verificar isso

> localStorage.setItem('foo', 123)
undefined
> localStorage.hasOwnProperty('foo')
true
> localStorage.hasOwnProperty('bar')
false

Funciona nas versões atuais do Chrome (Mac), Firefox (Mac) e Safari.

Stephan Hoyer
fonte
2
Deve ser a resposta aceita. O aceito considerará um valor "nulo" armazenado como não definido, o que está errado.
Flavien Volken
9
@FlavienVolken Você não pode ter um nullvalor armazenado . Você pode ter "null", mas o código não se comportará mal, enquanto este falhará na lengthchave.
Kaiido # 4/18
1
@Kaiido, você está certo, eu tive esse comportamento porque estava analisando diretamente os dados armazenados e como JSON.parse("null") === JSON.parse(null)tive uma colisão.
Flavien Volken
3
Obteve o seguinte erro de ESLint: "Não acesse o método Object.prototype 'hasOwnProperty' do target object.eslint (no-prototype-builtins)"
rfdc
Isso não funcionará se foo não estiver definido no carregamento da página e você desejar fazer algo com foo. Eu acho que é isso que o interlocutor estava chegando, você quer verificar se a chave fooexiste, não se foo tem um valor. Eu tenho essa situação, em que um evento de clique é acionado .setitemcom lógica baseada em getItem, mas não funcionará até eu definir o Item, e não posso definir o item até conhecer o estado do foo (valor1 ou valor2). Em outras palavras, marque foo exit e defina-o como value1, se não ocorrer, sem sobrescrever acidentalmente o valor2.
Rin e Len
22

A maneira mais curta é usar o valor padrão, se a chave não estiver no armazenamento:

var sValue = localStorage['my.token'] || ''; /* for strings */
var iValue = localStorage['my.token'] || 0; /* for integers */
Vladislav
fonte
4

Você também pode tentar isso se quiser verificar indefinidamente:

if (localStorage.user === undefined) {
    localStorage.user = "username";
}

getItem é um método que retorna nulo se o valor não for encontrado.

Prime_Coder
fonte
3
if(!localStorage.hash) localStorage.hash = "thinkdj";

Ou

var secret =  localStorage.hash || 42;
Deepak Thomas
fonte
JavaScript retorna o primeiro valor não nulo ou positivo Exemplos: [null || "abc"] retornará "abc" [2 || 5] retornará 2 [0 || 5] retornará 5 [1 || 5] retornará 1 etc. Portanto, o código acima funciona.
Deepak Thomas
2

De verdade

localStorage.infiniteScrollEnabled = 1;

PARA FALSO

localStorage.removeItem("infiniteScrollEnabled")

VERIFIQUE A EXISTÊNCIA

if (localStorage[""infiniteScrollEnabled""]) {
  //CODE IF ENABLED
}
Derin
fonte
1

Você deve verificar o tipo do item no localStorage

if(localStorage.token !== null) {
   // this will only work if the token is set in the localStorage
}

if(typeof localStorage.token !== 'undefined') {
  // do something with token
}

if(typeof localStorage.token === 'undefined') {
  // token doesn't exist in the localStorage, maybe set it?
}
webmaster
fonte
1

Como alguém pode testar a existência de um item localStorage? esse método funciona no internet explorer.

<script>
    try{
        localStorage.getItem("username");
    }catch(e){
        alert("we are in catch "+e.print);
    }
</script>
le vantard
fonte
2
Certamente não deveria; getItem apenas retorna nulo para chaves que não existem.
22816 EricLaw #
Eu estava tendo o mesmo problema com o IE, e esta é a correção para ele, ++
edencorbin
Você definitivamente deve try | catchanalisar o item.
Abdul Sadik Yalcin
0
localStorage['root2']=null;

localStorage.getItem("root2") === null //false

Talvez seja melhor fazer uma varredura do plano?

localStorage['root1']=187;
187
'root1' in localStorage
true
zloctb
fonte
0

A melhor e mais segura maneira de sugerir é essa,

if(Object.prototype.hasOwnProperty.call(localStorage, 'infiniteScrollEnabled')){
    // init variable/set default variable for item
    localStorage.setItem("infiniteScrollEnabled", true);
}

Isso passa pela no-prototype-builtinsregra do ESLint .

Gaurav Gandhi
fonte
0

Eu usei no meu projeto e funciona perfeitamente para mim

var returnObjName= JSON.parse(localStorage.getItem('ObjName'));
if(returnObjName && Object.keys(returnObjName).length > 0){
   //Exist data in local storage
}else{
  //Non Exist data block
}
Rahul Vanave
fonte
0

maneira easist é

if(localStorage.test){
console.log("now defined");
}
else{
console.log("undefined");
localStorage.test="defined;"
}

Como funciona

quando você chama localStorage.test pela primeira vez, ele não contém nenhum armazenamento no objeto localStorage; portanto, ele retorna outros gatilhos de condição indefinidos. depois de disparado, defino uma nova variável e verifique novamente se ela contém dados para retornar dados com true se condição

ßãlãjî
fonte
-2

Experimente este código

if (localStorage.getItem("infiniteScrollEnabled") === null) {

} else {

}
Daniel Wichers
fonte
Faça ou não faça. Não há tentativa". Uma boa resposta sempre terá uma explicação do que foi feito e por que foi feito dessa maneira, não apenas para o OP, mas para futuros visitantes do SO.
Jay Blanchard