Apa yang Dilakukan Metode Storage key() di JavaScript

Apa Yang Dilakukan Metode Storage Key Di Javascript



JavaScript hadir dengan dua jenis objek penyimpanan 'lokal' dan 'sesi' yang menyimpan data di penyimpanan lokal yaitu, browser web. “ lokal ” objek penyimpanan menyimpan data untuk situs web tertentu tanpa tanggal kedaluwarsa sedangkan “ sidang objek 'penyimpanan' menyimpan data hanya untuk sesi saat ini. Saat objek ini disimpan, objek tersebut dapat dengan mudah diakses melalui nama kuncinya dengan bantuan penyimpanan internal “ kunci() ' metode.

Posting ini menunjukkan metode Storage “key()” dalam JavaScript.

Apa yang Dilakukan Metode Storage key() di JavaScript?

kunci() ” Metode dikaitkan dengan objek Penyimpanan yang mengambil nama kunci yang ditempatkan pada indeks yang ditentukan. Objek 'penyimpanan' mungkin adalah ' lokal ” atau “ sidang ' penyimpanan. Ini memungkinkan pengguna untuk mengakses kunci penyimpanan lokal dan sesi.







Sintaks (Untuk Penyimpanan Lokal)



penyimpanan lokal. kunci ( indeks ) ;

Sintaks di atas menerima satu parameter “ indeks ” yang mengembalikan nama kunci pada indeks tertentu.



Sintaks (Untuk Penyimpanan Sesi)





sessionStorage. kunci ( indeks ) ;

Sintaks di atas juga mendukung parameter 'indeks' yang sama dengan 'localStorage'.

Kedua sintaks yang ditentukan di atas mengembalikan nama kunci objek penyimpanan sebagai string. Mari terapkan keduanya satu per satu.



Contoh 1: Menerapkan Metode Storage “key()” untuk Mengambil Nama Kunci Penyimpanan Lokal yang Ditentukan

Contoh ini menjelaskan implementasi praktis dari metode penyimpanan “key()” untuk mendapatkan nama kunci penyimpanan indeks lokal yang ditentukan.

Kode HTML

Pertama, lihat kode HTML yang diberikan:

< h2 > Kunci penyimpanan ( ) metode dalam JavaScript h2 >

< klik tombol = 'Fungsisaya()' > Dapatkan Kunci Penyimpanan Lokal yang Ditentukan tombol >

< p id = 'demo' > P >

Dalam cuplikan kode di atas:

  • Pertama, tentukan subjudul melalui “

    ” tag.

  • Selanjutnya, tambahkan tombol dengan bantuan “ ” tag yang terdiri dari “ onclick ” acara untuk menjalankan fungsi “ myFunc() ” pada klik tombol.
  • Terakhir, buat paragraf kosong melalui “

    ” yang dapat dengan mudah diakses melalui id “demo” yang ditetapkan.

Kode JavaScript

Selanjutnya, lanjutkan dengan kode yang disebutkan di bawah ini:

< naskah >

penyimpanan lokal. setItem ( 'Situs web' , 'Linux' ) ;

penyimpanan lokal. setItem ( 'Tutorial Pertama' , 'HTML' ) ;

penyimpanan lokal. setItem ( 'Tutorial Kedua' , 'JavaScript' ) ;

fungsi myFunc ( ) {

ada x = penyimpanan lokal. kunci ( 1 ) ;

dokumen. getElementById ( 'demo' ) . innerHTML = X ;

}

naskah >

Di blok kode di atas:

  • penyimpanan lokal Properti ” dikaitkan dengan properti “ setItem() ” metode untuk mengatur item penyimpanan lokal yang ditentukan.
  • Selanjutnya, fungsi bernama “ myFunc() ' didefinisikan.
  • Dalam definisinya, “ kunci() ” metode dikaitkan dengan “ penyimpanan lokal ” untuk mendapatkan nama kunci dari indeks pertama.
  • Setelah itu, “ dokumen.getElementById() ” metode diterapkan untuk mengakses paragraf kosong menggunakan id 'demo' untuk menambahkannya dengan 'nama' kunci item penyimpanan lokal.

Keluaran

Seperti yang terlihat, keluaran menampilkan nama kunci item penyimpanan lokal .e. 'SecondTutorial' pada indeks pertama dengan mengikuti urutan abjad setelah tombol diklik.

Contoh 2: Menerapkan Metode Penyimpanan “key()” untuk Mendapatkan Nama Kunci Penyimpanan Sesi yang Ditentukan

Dalam contoh ini, metode Storage “key()” mengembalikan nama kunci penyimpanan sesi dengan indeks tertentu.

Kode HTML

Pertama, pergi melalui kode HTML berikut:

< h2 > Kunci penyimpanan ( ) metode dalam JavaScript h2 >

< klik tombol = 'Fungsisaya()' > Dapatkan Kunci Penyimpanan Sesi yang Ditentukan tombol >

< p id = 'demo' > P >

Kode di atas sama dengan Contoh 1 tetapi dengan beberapa pembaruan pada konten HTML.

Kode JavaScript

Selanjutnya, lanjutkan ke kode berikut:

< naskah >

sessionStorage. setItem ( 'Situs web' , 'Linux' ) ;

sessionStorage. setItem ( 'Pertama' , 'HTML' ) ;

sessionStorage. setItem ( 'Kedua' , 'JavaScript' ) ;

fungsi myFunc ( ) {

ada x = sessionStorage. kunci ( 2 ) ;

dokumen. getElementById ( 'demo' ) . innerHTML = X ;

}

naskah >

Di sini, item penyimpanan sesi dibuat menggunakan tombol “ sessionStorage ' properti dan kemudian ' kunci() ” metode diterapkan untuk mendapatkan nama kunci penyimpanan sesi indeks yang ditentukan dari indeks kedua.

Keluaran

Dalam hasil ini, metode “key()” menampilkan nama kunci item penyimpanan sesi yang disimpan di indeks kedua. Proses pencarian nama storage key mengikuti urutan abjad yang dimulai pencarian dari “ 0 ” indeks.

Kesimpulan

JavaScript menyediakan Penyimpanan “ kunci() ” metode untuk mendapatkan nama kunci dengan indeks tertentu dari kedua “ lokal ” dan “ sidang ” benda penyimpanan. Itu mencari nama kunci yang ditentukan dalam penyimpanan dan kemudian menampilkan namanya di DOM (Document Object Model). Itu hanya membutuhkan parameter 'indeks' untuk melakukan tugas ini. Posting ini mengilustrasikan cara kerja metode 'key ()' JavaScript Storage secara detail.