CODEWITHSUNDEEP
javascripthtmlif-statement
Ethan Pelton
Ethan Pelton

Reputation: 1796

JavaScript not catching undefined from localStorage

I'm clearly missing something obvious.

I simply want to check for undefined. The script in the image is every way I know of to check for undefined, but although you can see in the watch that the value for currentbusiness is "undefined", the script goes through to the final else statement. Why isn't the script going in to any of the undefined checks?

enter image description here

Upvotes: 0

Views: 225

Answers (3)

nem035
nem035

Reputation: 35491

Because the value is "undefined" (a string, notice the quotes) not undefined.

The browser storage (localStorage/sessionStorage) coerces everything into a string when storing it, hence you get back a string no matter what you put inside.

When you coerce undefined to a string you get "undefined":

console.log(
  typeof String(undefined), // "string" this is what storage does to undefined
  typeof undefined          // "undefined"
);

You can check for this with a single strict comparison currentBusiness === "undefined"

Another option would be to just not store undefined values, which would then have the storage actually return you undefined (not "undefined") when requesting a value that was never stored and thus your checks would work as expected:

// assume currentBusiness was never stored in the first place
// because we chose not to store undefined values
localStorage["currentBusiness"] === undefined // true

Another thing worth pointing out is that you have redundant checks. Your first if condition 

if (typeof currentBusiness === 'undefined' || !currentBusiness)

will be true if the value has type "undefined", which only the value undefined has, or the value is falsy, which means it's one of these: "", 0, false, null, undefined, NaN.

This means if the value is undefined or anything falsy (this is redundant by itself since undefined is already falsy), it will always enter the first if and the other three checks will never happen because they all check for a falsy value.

As a matter of fact, just a falsy check would cover all your conditions:

if (!currentBusiness) // this handles all your individual checks

Upvotes: 1

Morad Ankri
Morad Ankri

Reputation: 76

In the right you can see that the value is the string "undefined" and you don't check for that in any of the cases:

  1. typeof... -> the type is string
  2. the value is not undefined
  3. the value is not null
  4. (!...) -> the value is truthy

so you get to the last 'else' section

Upvotes: 1

Ry-
Ry-

Reputation: 224922

localStorage converts anything you put in it to strings, so it has the string "undefined" in it instead of the value undefined. You can check for that the usual way:

if (currentBusiness === 'undefined') {

but it’s probably better to fix whatever’s setting the value to undefined to make it delete from localStorage instead:

if (valueToStore === undefined) {
    localStorage.removeItem('currentBusiness');
} else {
    localStorage.setItem('currentBusiness', valueToStore);
}

Upvotes: 0

Related Questions