ストレージアイテムが設定されているかどうかを確認するにはどうすればよいですか?


288

アイテムが設定されているlocalStorageかどうかを確認するにはどうすればよいですか?現在使用しています

if (!(localStorage.getItem("infiniteScrollEnabled") == true || localStorage.getItem("infiniteScrollEnabled") == false)) {
    // init variable/set default variable for item
    localStorage.setItem("infiniteScrollEnabled", true);
}

2
ストレージミューテックスがないと問題が発生するようです
4esn0k 2013

回答:


506

getItemWebStorage仕様のメソッドは、nullアイテムが存在しない場合に明示的に返します。

...指定されたキーがオブジェクトに関連付けられたリストに存在しない場合、このメソッドはnullを返す必要があります。...

だからあなたはできる:

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

この関連質問を参照してください:


1
localStorageこの小さなテストをカプセル化する独自のメソッドを追加できますか?例えばlocalStorage.hasItem("infiniteScrollEnabled")
ポールD.ウェイト

4
@Paul:はい、Storage.prototypeオブジェクトを拡張することもできますが、経験則として、所有していないオブジェクト、特にホストオブジェクトは変更ないことを常にお勧めします。
CMS

ああ、そうですね。CSSの背景から来て、ブラウザーの問題を自分で修正できるという考えは刺激的ですが、ブラウザーのオブジェクトをいじくり回すと混乱する可能性があることがわかります。
ポールD.ウェイト

5
注記が正しくありません。現在のバージョンのStorageインターフェースは、値がタイプであると明確に述べていますDOMStringw3.org/TR/webstorage/#the-storage-interface
Alnitak

1
メモを削除しました。ありがとう@TimothyZornとAlnitak
CMS

45

hasOwnPropertyメソッドを使用してこれを確認できます

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

Chrome(Mac)、Firefox(Mac)、Safariの現在のバージョンで動作します。


2
それは受け入れられる答えであるべきです。受け入れられたものは、格納された「null」値を設定されていないと見なしますが、これは誤りです。
Flavien Volken

9
@FlavienVolken nullただし、値を格納することはできません。あなたは持つことができます"null"が、そこにあるコードはそれで誤動作しませんが、これはlengthキーで失敗します。
海洋堂

1
@海道そうです、私は格納されたデータを直接解析してJSON.parse("null") === JSON.parse(null)いて、衝突があったので、私はこの動作をしました。
Flavien Volken

3
次のESLintエラーが発生しました:「ターゲットのobject.eslint(no-prototype-builtins)からObject.prototypeメソッド 'hasOwnProperty'にアクセスしないでください」
rfdc

ページの読み込み時にfooが設定されておらず、fooで何かを実行したい場合、これは機能しません。それが質問者が得ていたものだと思いますfoo。fooに値があるかどうかではなく、キーが存在するかどうかを確認したいと思います。.setitemgetItemに基づくロジックでクリックイベントがトリガーされるこの状況がありますが、setItemまでは機能せず、fooの状態(value1またはvalue2)を知るまでsetItemできません。言い換えると、誤ってvalue2を上書きしない限り、fooの終了をチェックしてからvalue1に設定します。
リンとレン

22

キーがストレージにない場合、最も短い方法はデフォルト値を使用することです:

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

4

未定義をチェックしたい場合もこれを試すことができます:

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

getItemは、値が見つからない場合にnullを返すメソッドです。


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

または

var secret =  localStorage.hash || 42;

JavaScriptは最初の非nullまたは正の値を返します例:[null || "abc"]は "abc" [2 ||を返します 5]は2 [0 ||を返します 5]は5 [1 ||を返します 5]は1などを返します。したがって、上記のコードは機能します。
Deepak Thomas

2

TRUEの場合

localStorage.infiniteScrollEnabled = 1;

偽りの

localStorage.removeItem("infiniteScrollEnabled")

存在を確認

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

1

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?
}

1

どのようにしてアイテムの存在をテストできlocalStorageますか?この方法はInternet Explorerで機能します。

<script>
    try{
        localStorage.getItem("username");
    }catch(e){
        alert("we are in catch "+e.print);
    }
</script>

2
それは確かにすべきではありません。getItemは、存在しないキーに対してはnullを返すだけです。
EricLaw 2016年

私はIEで同じ問題を抱えていましたが、これはその修正です++
edencorbin

try | catchアイテムを解析するときは、必ずすべきです。
Abdul Sadik Yalcin 2017年

0
localStorage['root2']=null;

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

多分計画のスキャンを行う方が良いですか?

localStorage['root1']=187;
187
'root1' in localStorage
true

0

私が提案できる最善かつ安全な方法はこれです、

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

これはESLintのno-prototype-builtinsルールを通過します。


0

私は自分のプロジェクトで使用しており、完璧に機能します

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

0

簡単な方法は

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

使い方

localStorage.testを初めて呼び出すときは、localStorageオブジェクトへのストアが含まれていないため、未定義のelse条件トリガーが返されます。他にトリガーされた後、新しい変数を設定し、データが含まれていることを再度確認して、if条件でtrueのデータを返します


-2

このコードを試してください

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

} else {

}

するかしないか。「トライ」はありません。良い答え常に行われていたもの、それはOPのためではなく、SOに、将来の訪問者のためだけではなく、そのようなAの方法で行われた理由の説明があります。
ジェイブランチャード
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.