JavaScript Extended #22: LocalStorage & SessionStorage

• 05/31/2025
• ariq fadhil
• 6

1. Apa itu Web Storage?

Web Storage adalah fitur browser untuk menyimpan data secara lokal di sisi client. Ada dua jenis utama, yaitu localStorage dan sessionStorage.

2. LocalStorage

localStorage menyimpan data secara persisten. Data tetap ada meskipun browser ditutup dan dibuka kembali.

localStorage.setItem("user", "Ariq");
const user = localStorage.getItem("user");
console.log(user);

3. SessionStorage

sessionStorage menyimpan data hanya selama tab browser masih aktif. Jika tab ditutup, data akan hilang.

sessionStorage.setItem("token", "12345");
const token = sessionStorage.getItem("token");

4. Menghapus Data

localStorage.removeItem("user");
sessionStorage.clear();

5. Menyimpan Object

Karena storage hanya menerima string, object harus diubah ke JSON terlebih dahulu.

const profile = {
  name: "Ariq",
  role: "Developer"
};

localStorage.setItem("profile", JSON.stringify(profile));

const savedProfile = JSON.parse(localStorage.getItem("profile"));
console.log(savedProfile.name);

6. Perbedaan LocalStorage vs SessionStorage

• LocalStorage: data bertahan lebih lama
• SessionStorage: data hilang saat tab ditutup
• Keduanya hanya bisa menyimpan string

7. Ringkasan

• Web Storage berguna untuk menyimpan data di browser
• Gunakan localStorage untuk data yang ingin tetap ada
• Gunakan sessionStorage untuk data sementara per sesi
• Object perlu disimpan dalam format JSON

Di part berikutnya, kita akan membahas template literals dan string modern.