最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

local storage - Cast "null" as null in javascript - Stack Overflow

programmeradmin2浏览0评论

I use the session storage to set a key that can take numeric values or null. I noticed that the field is stored as a string no matter what I put in. Is there a nice way to convert back my stored value to null ?

For instance, I want to do a check in my code as such:

if (!sessionStorage.getItem('key')) {
   // do something
}

Whats the best way to make that check? The obvious way would be

 if (!sessionStorage.getItem('key') !== "null") {
       // do something
 }

I am wondering if there's an alternative.

I use the session storage to set a key that can take numeric values or null. I noticed that the field is stored as a string no matter what I put in. Is there a nice way to convert back my stored value to null ?

For instance, I want to do a check in my code as such:

if (!sessionStorage.getItem('key')) {
   // do something
}

Whats the best way to make that check? The obvious way would be

 if (!sessionStorage.getItem('key') !== "null") {
       // do something
 }

I am wondering if there's an alternative.

Share Improve this question asked Mar 10, 2016 at 21:28 QuantumLichtQuantumLicht 2,1833 gold badges23 silver badges33 bronze badges 4
  • 1 Why don't you just use sessionStorage.removeItem('key') instead of sessionStorage.setItem('key','null')? – SeinopSys Commented Mar 10, 2016 at 21:30
  • For my use case, it's easier to manage. I have a dropdown menu to change set the value for key. it's binded to an event listerner, so it would be odd in one case to do a delete and in all other case to set the value no? – QuantumLicht Commented Mar 10, 2016 at 21:33
  • localStorage only stores strings, it has no concept of JavaScript types, so you should actually be checking for a specific string, be it null, not set, 0 or whatever you choose, or just remove the item and check that it's not set. – adeneo Commented Mar 10, 2016 at 21:35
  • I actually think checking to see if it is a null string is the best way. Unless you wrap it in try ... catch, parsing would throw an error if you try to JSON.parse(). – Matt Kuhns Commented Jan 17, 2023 at 17:28
Add a comment  | 

5 Answers 5

Reset to default 13

You can parse it

JSON.parse('null') // null
JSON.parse('1')   //  1

so

var val = sessionStorage.getItem('key');
val = JSON.parse(val);

Close to cast

Alternative would be:

var val = sessionStorage.getItem('key');
val = val*1 || null;

I just want something that would evaluate to false

You could use an empty string instead to mark the unset value:

sessionStorage.setItem('key','');

This way you can re-use your current check:

if (!sessionStorage.getItem('key')) {
   // do something
}

That said, you mentioned you had a drop down to select values, and that's why you need such a value, but I think a solution involving deleting the item on the null value would be better. Here's a working demo, and the code used to make it:

var dd = document.getElementById('dropdown');

dd.addEventListener('change', function(){
  var value = this.value;
  if (value === 'null')
    sessionStorage.removeItem('key');
  else sessionStorage.setItem('key', value);
});

var check = document.getElementById('check');
check.addEventListener('click', function(){
    this.innerHTML = 'Value: '+sessionStorage.getItem('key')+
                     ', check: '+(!sessionStorage.getItem('key'));
});
<select id="dropdown">
  <option value="null">none</option>
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
  <option>5</option>
</select>

<button id="check">Check value</button>

Serialize your value as JSON before writing it to storage.

var json = JSON.stringify(val);

Then parse it when you read it out again.

try {
  var val = JSON.parse(storage.item);
} catch(ex) {
  // handle errors
}

It's important to wrap the parser in a try block. If the user or the browser clears the session storage, then you'd be trying to JSON.parse('undefined') which will throw an error.

The sessionStorage is a key-value database where both are store as strings. You can see the documentation stating DOMString for both Storage.setItem() and Storage.getItem().

The nature of this is then that the objects you retrieve will always be strings. You will have to cast them manually, either by applying JSON.parse() or a completely manual approach. There is no way to get back the null without any operations.

Another approach that has been mentioned is simply to avoid storing null values in the sessionStorage. It is easier to check if a key exists than to cast it correctly afterwards.

Since the returned statements are in strings you can say if(!sessionStorage.setItem('key','')) {}

发布评论

评论列表(0)

  1. 暂无评论