Vad gör Storage key() Method i JavaScript

Vad Gor Storage Key Method I Javascript



JavaScript kommer med två typer av lagringsobjekt 'lokala' och 'session' som lagrar data i den lokala lagringen, dvs webbläsaren. den ' lokal ”lagringsobjekt lagrar data för den specifika webbplatsen utan utgångsdatum medan ” session 'lagring'-objekt sparar data endast för den aktuella sessionen. När dessa objekt lagras kan de enkelt nås genom deras nyckelnamn med hjälp av den inbyggda lagringen ' nyckel() 'metoden.

Det här inlägget demonstrerar lagringsmetoden 'key()' i JavaScript.

Vad gör Storage key()-metoden i JavaScript?

den ' nyckel() ”-metoden är associerad med Storage-objektet som hämtar nyckelnamnet placerat vid det angivna indexet. 'Lagrings'-objektet kan vara ' lokal ' eller den ' session ” lagring. Det låter användarna komma åt både de lokala nycklarna och sessionslagringsnycklarna.







Syntax (för lokal lagring)



lokalt utrymme. nyckel ( index ) ;

Ovanstående syntax accepterar en parameter ' index ” som returnerar namnet på nyckeln vid ett givet index.



Syntax (för sessionslagring)





sessionStorage. nyckel ( index ) ;

Ovanstående syntax stöder också parametern 'index' på samma sätt som 'localStorage'.

Båda de ovan definierade syntaxerna returnerar nyckelnamnet för lagringsobjektet som en sträng. Låt oss implementera båda en efter en.



Exempel 1: Använda lagringsmetoden “key()” för att hämta det angivna lokala lagringsnyckelnamnet

Det här exemplet förklarar den praktiska implementeringen av lagringsmetoden 'key()' för att få det lokala specificerade indexlagringsnyckelnamnet.

HTML-kod

Ta först en titt på den givna HTML-koden:

< h2 > Förvaringsnyckel ( ) Metod i JavaScript h2 >

< knappen när du klickar = 'myFunc()' > Hämta den specificerade lokala lagringsnyckeln knapp >

< p id = 'demo' > sid >

I kodavsnittet ovan:

  • Ange först en underrubrik via '

    '-tagg.

  • Lägg sedan till en knapp med hjälp av ' '-tagg som består av en ' onclick ' händelse för att utföra funktionen ' myFunc() ” på knappen klicka.
  • Slutligen, skapa ett tomt stycke via '

    '-tagg som lätt kan nås genom dess tilldelade id 'demo'.

JavaScript-kod

Fortsätt sedan med nedanstående kod:

< manus >

lokalt utrymme. setItem ( 'Hemsida' , 'Linux' ) ;

lokalt utrymme. setItem ( 'Första handledning' , 'HTML' ) ;

lokalt utrymme. setItem ( 'Andra handledning' , 'JavaScript' ) ;

funktion myFunc ( ) {

det finns x = lokalt utrymme. nyckel ( 1 ) ;

dokumentera. getElementById ( 'demo' ) . innerHTML = x ;

}

manus >

I ovanstående kodblock:

  • den ' lokalt utrymme ' egenskapen är associerad med ' setItem() ” metod för att ställa in de angivna lokala lagringsobjekten.
  • Därefter funktionen som heter ' myFunc() ' är definierad.
  • I sin definition är ' nyckel() ”-metoden är associerad med ” lokalt utrymme ” egenskap för att få nyckelnamnet för det första indexet.
  • Efter det kommer ' document.getElementById() ”-metoden används för att komma åt det tomma stycket med hjälp av dess id “demo” för att lägga till det med nyckeln för lokal lagringsobjekt “namn”.

Produktion

Som framgår visar utgången nyckelnamnet för det lokala lagringsobjektet .e. 'Second Tutorial' vid det första indexet genom att följa den alfabetiska ordningen när du klickar på knappen.

Exempel 2: Använda lagringsmetoden “key()” för att få det specificerade sessionslagringsnyckelnamnet

I det här exemplet returnerar lagringsmetoden 'key()' sessionslagringsnyckelns namn med ett visst index.

HTML-kod

Gå först igenom följande HTML-kod:

< h2 > Förvaringsnyckel ( ) Metod i JavaScript h2 >

< knappen när du klickar = 'myFunc()' > Hämta den specificerade sessionslagringsnyckeln knapp >

< p id = 'demo' > sid >

Ovanstående kod är samma som i exempel 1 men med några uppdateringar i HTML-innehållet.

JavaScript-kod

Gå sedan vidare till följande kod:

< manus >

sessionStorage. setItem ( 'Hemsida' , 'Linux' ) ;

sessionStorage. setItem ( 'Först' , 'HTML' ) ;

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

funktion myFunc ( ) {

det finns x = sessionStorage. nyckel ( 2 ) ;

dokumentera. getElementById ( 'demo' ) . innerHTML = x ;

}

manus >

Här skapas sessionslagringsobjekten med hjälp av ' sessionStorage egendom och sedan nyckel() ”-metoden används för att få det angivna indexsessionens lagringsnyckelnamn för det andra indexet.

Produktion

I det här resultatet visade 'key()'-metoden nyckelnamnet för sessionslagringsobjektet lagrat i det andra indexet. Sökprocessen för lagringsnyckelns namn följer den alfabetiska ordningen som börjar söka från ' 0 ” index.

Slutsats

JavaScript tillhandahåller lagringen ' nyckel() '-metoden för att få nyckelnamnet med det specifika indexet för både ' lokal ' och den ' session ” lagringsobjekt. Den söker efter det angivna nyckelnamnet i lagringen och visar sedan dess namn i DOM (Document Object Model). Det kräver bara parametern 'index' för att utföra denna uppgift. Det här inlägget illustrerade i detalj hur JavaScript Storage 'key()' fungerar.