Properti Window sessionStorage() digunakan untuk menyimpan pasangan kunci/nilai di browser web. Ini menyimpan pasangan kunci/nilai di browser hanya untuk satu sesi dan data kedaluwarsa segera setelah sesi baru dimuat
Jika Anda seorang pengembang web, Anda mungkin pernah mendengar tentang penyimpanan lokal dan penyimpanan sesi. Tapi apa sebenarnya mereka?
API Penyimpanan Web
Sebelum HTML5, developer hanya mengandalkan cookie untuk menyimpan data di sisi klien. Namun, saat HTML5 diperkenalkan, developer diberi pilihan untuk menggunakan API baru bernama Web Storage. API ini menyediakan dua jenis penyimpanan yang berbeda. penyimpanan lokal dan penyimpanan sesi. Penyimpanan lokal dan penyimpanan sesi memungkinkan aplikasi web menyimpan data secara lokal di browser pengguna
Penyimpanan Sesi
Penyimpanan sesi adalah jenis penyimpanan web yang memungkinkan data disimpan di sisi klien hanya selama durasi sesi saat ini. Setelah pengguna menutup browsernya, semua data yang telah disimpan di penyimpanan sesi akan dihapus
Penyimpanan sesi berguna untuk menyimpan data sementara yang tidak perlu dipertahankan di seluruh sesi, seperti ID sesi atau data sementara yang hanya digunakan selama durasi sesi saat ini.
Mengatur Data di Penyimpanan Sesi
Untuk mengatur data dalam penyimpanan sesi, Anda dapat menggunakan metode setItem(). Metode ini menerima dua argumen
- Kunci, yang merupakan string yang akan digunakan untuk mengidentifikasi data
- Nilai, yaitu data yang akan disimpan
Misalnya, untuk menyetel variabel sesi bernama user_id dengan nilai 1234, Anda akan melakukan hal berikut
sessionStorage.setItem(‘user_id’, ‘1234’);Mengambil Data Dari Penyimpanan Sesi
Untuk mengambil data dari penyimpanan sesi, Anda dapat menggunakan metode getItem(). Metode ini menerima satu argumen, yang merupakan kunci dari data yang ingin Anda ambil. Misalnya, untuk mendapatkan nilai variabel sesi user_id, Anda akan melakukan hal berikut
let user_id = sessionStorage.getItem(‘user_id’); // 1234_Menghapus Data Dari Penyimpanan Sesi
Untuk menghapus data dari penyimpanan sesi, Anda dapat menggunakan metode removeItem(). Metode ini menerima satu argumen, yang merupakan kunci dari data yang ingin Anda hapus. Untuk menghapus variabel sesi user_id, Anda akan melakukan hal berikut
sessionStorage.removeItem(‘user_id’);Penyimpanan lokal
Penyimpanan lokal adalah jenis penyimpanan web yang memungkinkan data disimpan di sisi klien tanpa batas. Tidak seperti penyimpanan sesi, data yang disimpan di penyimpanan lokal tetap ada bahkan setelah browser ditutup
Penyimpanan lokal berguna untuk menyimpan data yang perlu disimpan di seluruh sesi, seperti preferensi atau pengaturan pengguna
Mengatur Data di Penyimpanan Lokal
Untuk mengatur data di penyimpanan lokal, Anda juga dapat menggunakan metode setItem(). Metode ini menerima dua argumen yang sama
- Kunci, yang merupakan string yang akan digunakan untuk mengidentifikasi data
- Nilai, yaitu data yang akan disimpan
Menggunakan contoh yang sama, kita dapat menetapkan variabel lokal bernama user_id ke nilai 1234
localStorage.setItem(‘user_id’, ‘1234’);Mengambil Data Dari Penyimpanan Lokal
Untuk mengambil data dari penyimpanan lokal, Anda juga dapat menggunakan metode getItem(). Metode ini menerima argumen tunggal yang sama, yang merupakan kunci dari data yang ingin Anda ambil
let user_id = localStorage.getItem(‘user_id’); // 1234_Menghapus Data Dari Penyimpanan Lokal
Untuk menghapus semua data dari penyimpanan lokal, Anda dapat menggunakan metode let user_id = sessionStorage.getItem(‘user_id’); // 12342. Metode ini tidak menerima argumen apa pun
Untuk menghapus item tertentu dari penyimpanan lokal, Anda dapat menggunakan metode removeItem(). Metode ini menerima satu argumen, yang merupakan kunci dari data yang ingin Anda hapus
localStorage.removeItem(‘user_id’);Penyimpanan Lokal vs Penyimpanan Sesi
Sekarang kita telah membahas dasar-dasar penyimpanan lokal dan penyimpanan sesi, mari kita bahas perbedaan antara keduanya
Perbedaan utama antara penyimpanan lokal dan penyimpanan sesi adalah bahwa data yang disimpan di penyimpanan lokal tetap ada bahkan setelah browser ditutup, sementara data yang disimpan di penyimpanan sesi hanya tersedia selama durasi sesi saat ini.
Perbedaan lainnya adalah penyimpanan lokal tidak berbasis sesi, artinya data di dalam penyimpanan lokal harus dihapus secara manual. Terakhir, kapasitas penyimpanan penyimpanan lokal juga lebih besar dari penyimpanan sesi
Penyimpanan lokal paling baik digunakan untuk data yang perlu disimpan di seluruh sesi, seperti preferensi atau pengaturan pengguna. Penyimpanan sesi lebih cocok untuk data sementara yang tidak perlu disimpan setelah sesi berakhir
Saya harap artikel ini menghilangkan kebingungan yang Anda miliki. Semoga berhasil dengan proyek pengkodean Anda
Lebih banyak konten di PlainEnglish. io. Mendaftar untuk buletin mingguan gratis kami. Ikuti kami di Twitter dan LinkedIn. Lihat Perselisihan Komunitas kami dan bergabunglah dengan Talent Collective kami