Bagaimana cara memeriksa apakah item Penyimpanan diatur?

288

Bagaimana saya bisa mengecek apakah suatu item diatur localStorage? Saat ini saya menggunakan

if (!(localStorage.getItem("infiniteScrollEnabled") == true || localStorage.getItem("infiniteScrollEnabled") == false)) {
    // init variable/set default variable for item
    localStorage.setItem("infiniteScrollEnabled", true);
}
Jiew Meng
sumber
2
tampaknya, Anda akan memiliki masalah tanpa penyimpanan mutex
4esn0k

Jawaban:

506

The getItemmetode dalam spesifikasi WebStorage, secara eksplisit mengembalikan nulljika item tidak ada:

... Jika kunci yang diberikan tidak ada dalam daftar yang terkait dengan objek maka metode ini harus mengembalikan nol. ...

Jadi kamu bisa:

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

Lihat pertanyaan terkait ini:

CMS
sumber
1
Bisakah Anda menambahkan metode Anda sendiri localStorageuntuk merangkum tes kecil ini? Misalnya localStorage.hasItem("infiniteScrollEnabled")?
Paul D. Waite
4
@ Paul: Ya, Anda bahkan dapat menambah Storage.prototypeobjek, tetapi sebagai aturan praktis saya selalu menyarankan untuk tidak memodifikasi objek yang tidak Anda miliki , terutama objek host.
CMS
ooh ya, poin bagus di sana. Berasal dari latar belakang CSS, gagasan bahwa saya dapat memperbaiki sendiri masalah peramban itu menarik, tetapi saya dapat melihat bagaimana menyiasati objek peramban bisa membingungkan.
Paul D. Waite
5
Catatan tidak benar - versi Storageantarmuka saat ini secara spesifik mengatakan bahwa nilainya berjenis DOMString. w3.org/TR/webstorage/#the-storage-interface
Alnitak
1
Catatan dihapus. Terima kasih @TimothyZorn dan Alnitak
CMS
45

Anda dapat menggunakan hasOwnPropertymetode untuk memeriksa ini

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

Bekerja di versi Chrome (Mac), Firefox (Mac) dan Safari saat ini.

Stephan Hoyer
sumber
2
Itu harus menjadi jawaban yang diterima. Yang diterima akan menganggap nilai "null" yang disimpan tidak disetel, yang salah.
Flavien Volken
9
@FlavienVolken Anda tidak dapat memiliki nullnilai tersimpan . Anda dapat memilikinya "null", tetapi kode di sana tidak akan berperilaku salah, sementara kode ini akan gagal length.
Kaiido
1
@ Kaiido Anda benar, saya memiliki perilaku ini karena saya langsung mengurai data yang disimpan dan karena JSON.parse("null") === JSON.parse(null)saya memiliki tabrakan.
Flavien Volken
3
Mendapat kesalahan ESLint berikut: "Jangan mengakses metode Object.prototype 'hasOwnProperty' dari target object.eslint (no-prototype-builtins)"
rfdc
Ini tidak akan berfungsi jika foo tidak disetel pada pemuatan halaman dan Anda ingin melakukan sesuatu dengan foo. Saya pikir itulah maksud si penanya, Anda ingin memeriksa apakah kuncinya fooada, bukan apakah foo memiliki nilai. Saya mengalami situasi ini, di mana acara klik dipicu .setitemdengan logika berbasis di getItem, tetapi tidak akan berfungsi sampai saya setItem, dan saya tidak bisa mengaturItem sampai saya tahu keadaan foo (value1 atau value2). Dengan kata lain, periksa foo keluar kemudian atur ke value1 jika tidak tanpa sengaja menimpa nilai2.
Rin dan Len
22

Cara terpendek adalah menggunakan nilai default, jika kunci tidak ada dalam penyimpanan:

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

Anda juga dapat mencoba ini jika Anda ingin memeriksa yang tidak terdefinisi:

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

getItem adalah metode yang mengembalikan null jika nilai tidak ditemukan.

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

Atau

var secret =  localStorage.hash || 42;
Deepak Thomas
sumber
JavaScript mengembalikan nilai pertama yang bukan nol atau positif. Contoh: [null || "abc"] akan mengembalikan "abc" [2 || 5] akan mengembalikan 2 [0 || 5] akan mengembalikan 5 [1 || 5] akan mengembalikan 1 dll. Karenanya kode di atas berfungsi.
Deepak Thomas
2

Untuk BENAR

localStorage.infiniteScrollEnabled = 1;

UNTUK SALAH

localStorage.removeItem("infiniteScrollEnabled")

PERIKSA KEBERADAAN

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

Anda harus memeriksa jenis item di Penyimpanan lokal

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?
}
webmaster
sumber
1

Bagaimana seseorang dapat menguji keberadaan suatu item localStorage? metode ini berfungsi di internet explorer.

<script>
    try{
        localStorage.getItem("username");
    }catch(e){
        alert("we are in catch "+e.print);
    }
</script>
le vantard
sumber
2
Jelas tidak seharusnya; getItem hanya mengembalikan null untuk kunci yang tidak ada.
EricLaw
Saya mengalami masalah yang sama dengan IE, dan ini adalah perbaikan untuk itu, ++
edencorbin
Anda pasti harus try | catchmenguraikan item.
Abdul Sadik Yalcin
0
localStorage['root2']=null;

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

Mungkin lebih baik melakukan pemindaian rencana?

localStorage['root1']=187;
187
'root1' in localStorage
true
zloctb
sumber
0

Cara terbaik dan teraman yang bisa saya sarankan adalah ini,

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

Ini melewati no-prototype-builtinsaturan ESLint .

Gaurav Gandhi
sumber
0

Saya telah menggunakan proyek saya dan bekerja dengan sempurna untuk saya

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

cara mudah adalah

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

Bagaimana itu bekerja

ketika Anda memanggil localStorage.test pertama kali itu tidak mengandung toko ke objek localStorage sehingga mengembalikan kondisi lain yang tidak ditentukan memicu. setelah dipicu saya mengatur variabel baru dan lagi memeriksa itu berisi data sehingga mengembalikan data dengan true jika kondisi

ßãlãjî
sumber
-2

Coba kode ini

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

} else {

}
Daniel Wichers
sumber
Lakukan atau tidak. Tidak ada percobaan". Sebuah jawaban yang baik akan selalu memiliki penjelasan tentang apa yang dilakukan dan mengapa itu dilakukan sedemikian rupa, tidak hanya untuk OP tetapi untuk pengunjung masa depan ke SO.
Jay Blanchard