[解決済み] localStorage.itemやlocalStorage['item']よりもlocalStorage.getItem('item')の方がいいのか？

質問

最近、私は について質問しました。 . 使用方法 JSON.parse(localStorage.item) と JSON.parse(localStorage['item']) を返すように動作していませんでした。 NULL を返すように動作していませんでした。

しかし JSON.parse(localStorage.getItem('item') は機能しました。そして、それは判明しました。 JSON.parse(localStorage.testObject || null) も動作することがわかりました。

コメントの一つ は、基本的に次のように述べています。 localStorage.getItem() と localStorage.setItem() が常に優先されるべきです。

ゲッターとセッターは、一貫性があり、標準化されており、かつ クロスブラウザ互換のLS APIを使用する方法を提供します。 他の方法よりも優先されるべきです。- クリストフ

私は localStorage のためにドットやブラケットの省略記法を使うのが好きになってきました。 localStorage.item や localStorage['item'] よりも localStorage.getItem('item') の方がいいのでしょうか、それとも、それらが動作する限りは、省略記法でもいいのでしょうか？

どのように解決するのですか？

プロパティへの直接アクセス( localStorage.item または localStorage['item'] ) を使用し、機能インターフェイス ( localStorage.getItem('item') ) を使っても問題ありません。どちらも標準的で、クロスブラウザに対応しています。 ^* によれば 仕様書 :

Storageオブジェクトでサポートされているプロパティ名は、オブジェクトに関連付けられたリストに現在存在する各キー/値のペアのキーで、キーが最後にストレージ領域に追加された順番になります。

要求された名前のkey/valueペアが見つからない場合、それらはただ異なる動作をします。例えば、もしキー 'item' が存在しない場合 var a = localStorage.item; は結果として a である undefined でありながら var a = localStorage.getItem('item'); は結果的に a という値を持つ null . あなたが発見したように undefined と null は JavaScript/EcmaScript では互換性がありません。）

EDITです。 でChristophが指摘しているように 彼の回答 の定義済みプロパティに等しいキーの値を確実に保存・取得する唯一の方法は、関数型インターフェースです。 localStorage . (これらは6つあります。 length , key , setItem , getItem , removeItem そして clear .) ですから、例えば次のようにすれば必ずうまくいきます。

localStorage.setItem('length', 2);
console.log(localStorage.getItem('length'));

特に、最初のステートメントがプロパティである localStorage.length のプロパティに影響を与えません (ただし、キー 'length' にすでに localStorage ). この点で、この仕様は内部的に矛盾しているように見えます。

しかし、以下はおそらくあなたが望むことはできないでしょう。

localStorage.length = 2;
console.log(localStorage.length);

興味深いことに、1つ目はChromeではno-opですが、Firefoxではfunctional callと同義です。2つ目は、常に localStorage .

^* _{これは、そもそもウェブ ストレージをサポートするブラウザに当てはまります。(これは、最近のデスクトップおよびモバイルブラウザのほとんどすべてを含みます。) クッキーまたは他の技術を使用してローカルストレージをシミュレートする環境では、動作は使用するシムに依存します。のポリフィルがいくつかあります。 localStorage に対するポリフィルがいくつかあります。 はこちら .}