Javascript localstorage condition not responding

Question

I am testing to see if a localstorage key exists or not.

So first I've done a console.log to see what's inside the value...

console.log(localStorage.getItem('mykey'));

This returns null

So I've done this for a condition:

if (localStorage.getItem('mykey') === null) {
    console.log('It is null');
}

But although I know it's null it's not showing:

console.log('It is null');

What could the problem be?

I can reproduce this by setting the item to `"null"`, since `"null"` is a string and different from `null`. — , Jun 20 '18 at 09:17
I mean't "null" without the quotes ... I'll edit the question — , Jun 20 '18 at 09:19
You've run `setItem('mykey', ...)` during testing, now the key exists. — Teemu, Jun 20 '18 at 09:21
run something like this before localStorage.setItem('mykey','crapycode'); — Melchia, Jun 20 '18 at 09:21
It takes time to make CRUD operations with localstorage https://stackoverflow.com/questions/23677373/can-localstorage-slow-down-my-website-when-used-frequently — Melchia, Jun 20 '18 at 09:25

Asons · Accepted Answer · 2018-06-20T09:55:57.570

1

Updated

The original posted localStorage.getItem('mykey') === null actually returns true on Chrome, so it might be a browser related issue.

So by using the first suggested solution with double equal ==, one might get a better crossbrowser support, though the 2nd/3rd options might be even better.

~~If the key doesn't exist, the returned value is an object being null, which is not the exact same type (===) as null~~

Either drop one = (and it will do an auto-cast) and it will work

if (localStorage.getItem('mykey') == null) {
  console.log('It is null');
}

or simply do something like e.g.

if (!localStorage.getItem('mykey')) {
  console.log('It is null');
}

or (as shown here) which might be even better (and could be a dupe actually)

if (!localStorage.hasOwnProperty('mykey')) {
  console.log('It is null');
}

edited Jun 20 '18 at 09:55

answered Jun 20 '18 at 09:28

Asons

84,923
12
110
165

I don't think the first suggestion is correct. `localStorage.getItem('randomkey') === null` is true (tested on Chromium 66) – Aurélien Bottazini Jun 20 '18 at 09:46
@AurélienBottazini With Version 67.0.3396.87 (Official Build) (64-bit) it also returns true ... hmmm, will update my answer, as it appears this might be a browser issue then. Thanks for the comment – Asons Jun 20 '18 at 09:51
@AurélienBottazini Updated my answer with something that might be more appropiate. – Asons Jun 20 '18 at 09:56

score 0 · Answer 2 · answered Jun 20 '18 at 09:27

If you set localStorage.setItem('someKey', null) and then if you will try get and check someKey value like this localStorage.getItem('someKey') === null comparison result will false you need use JSON.parse() method before comparison with null like this JSON.parse(localStorage.getItem('someKey')) === null

score 0 · Answer 3 · answered Jun 20 '18 at 09:28

0

Check if localStorage is null.If localStorage is null the control won't enter the if block.

answered Jun 20 '18 at 09:28

ravichandra vydhya

899
9
11

score 0 · Answer 4 · answered Jun 20 '18 at 09:39

Hypothesis on what is happening:

localStorage.setItem('mykey', null)
console.log(localStorage.getItem('mykey')) // returns "null"

So explicitly setting mykey to null actually sets it to the "null" string.

For that comparaison to work you could do

if (localStorage.getItem('mykey') === 'null') {
  console.log('It is null');
}

score 0 · Answer 5 · answered Jun 20 '18 at 09:46

The identity (===) operator checks whether both the operands are equal or identical in both value and datatype. That is,

var a = 2;
if (a === '2')

- will return false, since a is integer and '2' is a string. Where as,

if (a == 2)

- will return true, since '==' operator doen't enforce datatype eqality.

So in order to handle all situations like, the key is missing from localStorage or it is explicitly set to null, you should use '==' operator.

Javascript localstorage condition not responding

5 Answers5