Analisis storan setempat: Apakah jenis teknologi pangkalan data itu?

Fahami storan setempat: Apakah jenis teknologi pangkalan data itu?

Dalam pembangunan web, penyimpanan dan pemprosesan data sentiasa menjadi isu penting. Dengan perkembangan teknologi komputer yang berterusan, pelbagai teknologi pangkalan data turut muncul satu demi satu. Antaranya, localstorage ialah teknologi pangkalan data yang digunakan secara meluas. Ia adalah penyelesaian storan tempatan yang disediakan oleh HTML5 yang boleh menyimpan dan membaca data dalam penyemak imbas. Artikel ini akan memperkenalkan ciri dan penggunaan storan setempat, dan memberikan contoh kod khusus.

1. Ciri storan setempat

1. Storan kekal: Data yang disimpan dalam storan setempat tidak akan hilang disebabkan penyegaran atau penutupan halaman, melainkan cache penyemak imbas dipadamkan secara manual. Ini menjadikan storan setempat sesuai untuk menyimpan data yang perlu disimpan untuk masa yang lama, seperti tetapan dan pilihan peribadi pengguna.
2. Had saiz 5MB: HTML5 menetapkan bahawa kapasiti maksimum storan setempat di bawah setiap nama domain ialah 5MB. Walaupun kapasiti terhad, ia cukup untuk menyimpan sedikit teks, nombor, gambar kecil dan data lain.
3. Storan pasangan nilai kunci: storan setempat menyimpan data dalam bentuk pasangan nilai kunci, dan setiap pasangan nilai kunci ialah rentetan. Nilai yang disimpan boleh menjadi rentetan, nombor, nilai Boolean, objek, dll.
4. Digunakan terutamanya untuk storan bahagian hadapan: storan setempat digunakan terutamanya untuk storan bahagian hadapan, menyimpan dan mengakses data dilakukan dalam penyemak imbas. Ini menjadikan storan setempat lebih pantas dan mudah daripada pangkalan data hujung belakang tradisional.

2. Cara menggunakan localstorage

1. Menyimpan data: Anda boleh menggunakan kaedah setItem() objek localstorage untuk menyimpan data. Kaedah setItem() menerima dua parameter, parameter pertama ialah nama kunci, dan parameter kedua ialah nilai.

Contoh kod:

localStorage.setItem("username", "张三");
localStorage.setItem("age", 18);
localStorage.setItem("isVIP", true);

2. Membaca data: Anda boleh menggunakan kaedah getItem() objek localstorage untuk membaca data. Kaedah getItem() menerima satu parameter, iaitu nama kunci.

Contoh kod:

var username = localStorage.getItem("username");
var age = localStorage.getItem("age");
var isVIP = localStorage.getItem("isVIP");
console.log(username);  // 输出：张三
console.log(age);  // 输出：18
console.log(isVIP);  // 输出：true

3. Ubah suai data: Jika anda ingin mengubah suai data yang disimpan, hanya gunakan kaedah setItem() untuk menetapkan semula nilai yang sepadan dengan nama kunci.

Contoh kod:

localStorage.setItem("age", 19);
var age = localStorage.getItem("age");
console.log(age);  // 输出：19

4. Padam data: Anda boleh menggunakan kaedah removeItem() objek localstorage untuk memadam data yang disimpan. Kaedah removeItem() menerima satu parameter, iaitu nama kunci.

Contoh kod:

localStorage.removeItem("isVIP");
var isVIP = localStorage.getItem("isVIP");
console.log(isVIP);  // 输出：null

3. Keserasian localstorage
localstorage ialah sebahagian daripada HTML5 dan kebanyakan penyemak imbas moden menyokongnya. Walau bagaimanapun, untuk memastikan keserasian, anda boleh menggunakan kod berikut untuk menentukan sama ada penyemak imbas menyokong localstorage:

if (typeof(Storage) !== "undefined") {
    // 浏览器支持localstorage
} else {
    // 浏览器不支持localstorage
}

Pada beberapa versi lama penyemak imbas, localstorage mungkin tidak disokong. Pada masa ini, kaedah penyimpanan lain seperti kuki boleh digunakan sebagai ganti.

Ringkasan:
Artikel ini memperkenalkan ciri dan penggunaan storan setempat. Sebagai teknologi storan tempatan, storan tempatan mempunyai ciri storan kekal, had saiz 5MB, storan nilai kunci, dsb., dan sesuai untuk storan bahagian hadapan dengan jumlah data yang lebih kecil. Data boleh disimpan dan dibaca dengan mudah melalui setItem(), getItem(), removeItem() dan kaedah lain. Saya harap artikel ini akan membantu semua orang memahami localstorage dan memberikan contoh kod yang sepadan.

Atas ialah kandungan terperinci Analisis storan setempat: Apakah jenis teknologi pangkalan data itu?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!