¿Cómo verificar si un elemento de almacenamiento está configurado?

288

¿Cómo puedo verificar si un artículo está configurado localStorage? Actualmente estoy usando

if (!(localStorage.getItem("infiniteScrollEnabled") == true || localStorage.getItem("infiniteScrollEnabled") == false)) {
    // init variable/set default variable for item
    localStorage.setItem("infiniteScrollEnabled", true);
}
Jiew Meng
fuente
2
parece que tendrá un problema sin un mutex de almacenamiento
4esn0k

Respuestas:

509

El getItemmétodo en la especificación de WebStorage, devuelve explícitamente nullsi el elemento no existe:

... Si la clave dada no existe en la lista asociada con el objeto, entonces este método debe devolver nulo. ...

Así que puedes:

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

Ver esta pregunta relacionada:

CMS
fuente
1
¿Podría agregar su propio método localStoragepara encapsular esta pequeña prueba? Por ejemplo localStorage.hasItem("infiniteScrollEnabled")?
Paul D. Waite
44
@Paul: Sí, incluso podría aumentar el Storage.prototypeobjeto, pero como regla general, siempre recomiendo no modificar objetos que no le pertenecen , especialmente objetos host.
CMS
ooh sí, buenos puntos allí. Viniendo de un fondo CSS, la idea de que puedo solucionar los problemas del navegador yo mismo es emocionante, pero puedo ver cómo la confusión con los objetos del navegador puede ser confusa.
Paul D. Waite
55
La nota es incorrecta: la versión actual de la Storageinterfaz dice específicamente que los valores son de tipo DOMString. w3.org/TR/webstorage/#the-storage-interface
Alnitak
1
Nota eliminada Gracias @TimothyZorn y Alnitak
CMS
45

Puede usar el hasOwnPropertymétodo para verificar esto

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

Funciona en las versiones actuales de Chrome (Mac), Firefox (Mac) y Safari.

Stephan Hoyer
fuente
2
Debería ser la respuesta aceptada. El aceptado considerará un valor "nulo" almacenado como no establecido, lo cual es incorrecto.
Flavien Volken
9
@FlavienVolken Sin embargo, no puede tener un nullvalor almacenado . Puede tenerlo "null", pero el código allí no se comportará mal, mientras que este fallará en la lengthclave.
Kaiido
1
@Kaiido tienes razón, tuve este comportamiento porque estaba analizando directamente los datos almacenados y porque JSON.parse("null") === JSON.parse(null)tuve una colisión.
Flavien Volken
3
Obtuve el siguiente error de ESLint: "No acceda al método Object.prototype 'hasOwnProperty' desde el objeto objetivo.eslint (no-prototype-builtins)"
rfdc
Esto no funcionará si foo no está configurado en la carga de la página y desea hacer algo con foo. Creo que a eso se refería el interrogador, desea verificar si la clave fooexiste, no si foo tiene un valor. Tengo esta situación, donde un evento click se dispara .setitemcon una lógica basada en getItem, pero no funcionará hasta que establezca el elemento, y no puedo configurarlo hasta que sepa el estado de foo (valor1 o valor2). En otras palabras, verifique las salidas foo y luego configúrelo en el valor1 si no lo hace sin sobrescribir accidentalmente el valor2.
Rin y Len
22

La forma más corta es usar el valor predeterminado, si la clave no está almacenada:

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

También puede probar esto si desea verificar si no está definido:

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

getItem es un método que devuelve nulo si no se encuentra el valor.

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

O

var secret =  localStorage.hash || 42;
Deepak Thomas
fuente
JavaScript devuelve el primer valor no nulo o positivo Ejemplos: [nulo || "abc"] devolverá "abc" [2 || 5] devolverá 2 [0 || 5] devolverá 5 [1 || 5] devolverá 1, etc. Por lo tanto, el código anterior funciona.
Deepak Thomas
2

De verdad

localStorage.infiniteScrollEnabled = 1;

Para falso

localStorage.removeItem("infiniteScrollEnabled")

VERIFICAR EXISTENCIA

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

Debe verificar el tipo de elemento en el almacenamiento local

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?
}
administrador de página web
fuente
1

¿Cómo se puede probar la existencia de un artículo en localStorage? Este método funciona en Internet Explorer.

<script>
    try{
        localStorage.getItem("username");
    }catch(e){
        alert("we are in catch "+e.print);
    }
</script>
le vantard
fuente
2
Ciertamente no debería; getItem simplemente devuelve un valor nulo para las claves que no existen.
EricLaw
Estaba teniendo el mismo problema con IE, y esta es la solución, ++
edencorbin
Definitivamente deberías try | catchal analizar el artículo.
Abdul Sadik Yalcin
0
localStorage['root2']=null;

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

¿Quizás sea mejor hacer un escaneo del plan?

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

La mejor y más segura forma en que puedo sugerir es esto,

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

Esto pasa por la no-prototype-builtinsregla de ESLint .

Gaurav Gandhi
fuente
0

Lo he usado en mi proyecto y funciona perfectamente para mí.

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
fuente
0

la forma más fácil es

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

Cómo funciona

cuando llama a localStorage.test por primera vez, no contiene ninguna tienda en el objeto localStorage, por lo que devuelve desencadenantes de condición no definidos. después de que se activara, configuré una nueva variable y nuevamente verifiqué que contiene datos para que devuelva datos con verdadero en condición

ßãlãjî
fuente
-2

Prueba este código

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

} else {

}
Daniel Wichers
fuente
Hacer o no hacer. Aquí no hay intentos". Una buena respuesta siempre tendrá una explicación de lo que se hizo y por qué se hizo de esa manera, no solo para el OP sino para los futuros visitantes de SO.
Jay Blanchard