O que o método Storage key () faz em JavaScript

O Que O Metodo Storage Key Faz Em Javascript



O JavaScript vem com dois tipos de objetos de armazenamento “local” e “sessão” que armazenam os dados no armazenamento local, ou seja, navegador da web. O ' local ” O objeto de armazenamento armazena dados para o site específico sem data de expiração, enquanto o “ sessão O objeto 'armazenamento' salva dados apenas para a sessão atual. Quando esses objetos são armazenados, eles podem ser facilmente acessados ​​por meio de seus nomes de chave com a ajuda do armazenamento integrado “ chave() ” método.

Este post demonstra o método “key()” do Storage em JavaScript.

O que o método Storage key () faz em JavaScript?

O ' chave() ” está associado ao objeto Storage que recupera o nome da chave colocado no índice especificado. O objeto “armazenamento” pode ser o “ local ' ou o ' sessão ' armazenar. Ele permite que os usuários acessem as chaves de armazenamento locais e de sessão.







Sintaxe (para armazenamento local)



localStorage. chave ( índice ) ;

A sintaxe acima aceita um parâmetro “ índice ” que retorna o nome da chave em um determinado índice.



Sintaxe (para armazenamento de sessão)





sessãoStorage. chave ( índice ) ;

A sintaxe acima também suporta o parâmetro “index” igual ao “localStorage”.

Ambas as sintaxes definidas acima retornam o nome da chave do objeto de armazenamento como uma string. Vamos implementar ambos um por um.



Exemplo 1: Aplicação do método “key()” de armazenamento para recuperar o nome da chave de armazenamento local especificado

Este exemplo explica a implementação prática do método de armazenamento “key()” para obter o nome da chave de armazenamento de índice local especificado.

Código HTML

Primeiro, dê uma olhada no código HTML fornecido:

< h2 > Chave de armazenamento ( ) Método em JavaScript h2 >

< botão ao clicar = 'minhaFunc()' > Obtenha a chave de armazenamento local especificada botão >

< p id = 'demonstração' > p >

No trecho de código acima:

  • Primeiro, especifique um subtítulo através do “

    ' marcação.

  • Em seguida, adicione um botão com a ajuda do botão “ ” etiqueta compreendendo um “ ao clicar ” evento para executar a função “ minhafunção() ” no clique do botão.
  • Por fim, crie um parágrafo vazio por meio do botão “

    ” que pode ser facilmente acessada por meio de seu ID atribuído “demo”.

Código JavaScript

Em seguida, prossiga com o código abaixo indicado:

< roteiro >

localStorage. setItem ( 'Local na rede Internet' , 'Linux' ) ;

localStorage. setItem ( 'Primeiro Tutorial' , 'HTML' ) ;

localStorage. setItem ( 'Segundo Tutorial' , 'JavaScript' ) ;

função minhafunção ( ) {

existe x = localStorage. chave ( 1 ) ;

documento. getElementById ( 'demonstração' ) . HTML interno = x ;

}

roteiro >

No bloco de código acima:

  • O ' localStorage ” está associada à propriedade “ setItem() ” para definir os itens de armazenamento local especificados.
  • Em seguida, a função chamada “ minhafunção() ' é definido.
  • Em sua definição, o “ chave() ” está associado ao método “ localStorage ” para obter o nome da chave do primeiro índice.
  • Depois disso, o “ document.getElementById() ” é aplicado para acessar o parágrafo vazio usando seu id “demo” para anexá-lo com a chave do item de armazenamento local “name”.

Saída

Como visto, a saída exibe o nome da chave do item de armazenamento local .e. “SecondTutorial” no primeiro índice seguindo a ordem alfabética ao clicar no botão.

Exemplo 2: aplicando o método de armazenamento “key()” para obter o nome da chave de armazenamento de sessão especificada

Neste exemplo, o método Storage “key()” retorna o nome da chave de armazenamento da sessão com um índice específico.

Código HTML

Primeiro, passe pelo seguinte código HTML:

< h2 > Chave de armazenamento ( ) Método em JavaScript h2 >

< botão ao clicar = 'minhaFunc()' > Obtenha a chave de armazenamento de sessão especificada botão >

< p id = 'demonstração' > p >

O código acima é o mesmo do Exemplo 1, mas com algumas atualizações no conteúdo HTML.

Código JavaScript

Em seguida, passe para o seguinte código:

< roteiro >

sessãoStorage. setItem ( 'Local na rede Internet' , 'Linux' ) ;

sessãoStorage. setItem ( 'Primeiro' , 'HTML' ) ;

sessãoStorage. setItem ( 'Segundo' , 'JavaScript' ) ;

função minhafunção ( ) {

existe x = sessãoStorage. chave ( 2 ) ;

documento. getElementById ( 'demonstração' ) . HTML interno = x ;

}

roteiro >

Aqui, os itens de armazenamento de sessão são criados usando o “ sessãoArmazenamento ” propriedade e, em seguida, o “ chave() ” é aplicado para obter o nome da chave de armazenamento de sessão de índice especificado do segundo índice.

Saída

Nesse resultado, o método “key()” exibiu o nome da chave do item de armazenamento da sessão armazenado no segundo índice. O processo de busca pelo nome da chave de armazenamento segue a ordem alfabética que inicia a busca a partir do “ 0 ” índice.

Conclusão

JavaScript fornece o armazenamento “ chave() ” para obter o nome da chave com o índice específico de ambos os métodos “ local ' e a ' sessão ”objetos de armazenamento. Ele pesquisa o nome da chave especificada no armazenamento e, em seguida, exibe seu nome no DOM (Document Object Model). Requer apenas o parâmetro “index” para executar esta tarefa. Este post ilustrou o funcionamento do método “key()” do armazenamento JavaScript em detalhes.