JavaScript para… em vs para… de loop

JavaScript para… em vs para… de loop

Looping desempenha um papel vital no acesso aos itens para recuperar algum valor com base na condição. Este resultado está executando alguma operação em uma string específica ou um objeto convenientemente. Além disso, também é eficaz na iteração ao longo dos dados a granel, economizando tempo. Em tais casos, "para… in" e "para de”Os loops fornecem grandes funcionalidades para acessar de maneira inteligente dados.

Este blog explicará as diferenças entre para ... em e para ... de loop em javascript com a ajuda de exemplos.

JavaScript para… em vs para… de loop

O "para… in”O loop é útil em caso de iterar as propriedades de um objeto. Quando iterado através de uma string, ele retorna os índices correspondentes aos valores da string, em vez dos valores da string.

O "para deO loop, por outro. Em vez disso, ele atravessa os valores de um objeto iterável. No entanto, é adequado para iterar ao longo dos valores das cordas, pois os acessam facilmente e retorna os caracteres contidos separadamente.

Sintaxe

para (variável em string)

Na sintaxe dada:

  • ““variável”Refere -se aos caracteres contidos em uma string.
  • ““corda”Corresponde ao valor da string a ser iterado.
para (variável de iterável)

Na sintaxe acima:

  • ““variável”Aponta para o valor da próxima propriedade que deve ser atribuída à variável em cada iteração.
  • ““iterável”Indica o objeto com propriedades iteráveis.

Exemplo 1: iterando o para… e para… de loops sobre o valor da string

Este exemplo explicará o comportamento de ambos os loops declarados para iterá -los sobre o valor da string especificada.

para… em loop

Vamos seguir o exemplo abaixo do "para… in" laço:

No trecho de código acima:

  • Atribua o valor da string declarado chamado “Linuxhint”.
  • Depois disso, aplique o “para… in”Faça um loop para iterar ao longo dos caracteres de cordas.
  • Após a log, o resultado apontará para os índices nos quais os caracteres da string são armazenados.

Saída

Na saída acima, pode -se observar que os índices de string são recuperados.

para… de loop

Vamos observar o comportamento do “para de”Faça um loop após a iteração do valor da string especificada abaixo:

Nas linhas de código acima, execute as seguintes etapas:

  • Da mesma forma, especifique o valor da string declarado.
  • Na próxima etapa, aplique o “para de”Faça um loop para iterar ao longo do valor da string inicializado.
  • Finalmente, a saída resultará na busca dos caracteres diretamente contidos em uma string e exibindo -os.

Saída

Na saída acima, é evidente que os valores da string são retornados.

Exemplo 2: iterando para ... em e para… de loop sobre o objeto

Neste exemplo em particular, itera ambos os loops sobre o objeto criado e observe a saída resultante contra cada um deles.

para… em loop

Vamos observar o comportamento do “para… in”Loop itera -o através de um objeto.

Vamos seguir o exemplo abaixo do momento:

Nas linhas acima do código:

  • Crie um objeto chamado “Objdata”Com as propriedades nomeadas (Harry, ID e Age) e os valores correspondentes.
  • Na próxima etapa, aplique o “para… in”Loop para acessar as propriedades do objeto, bem como os valores correspondentes.
  • O primeiro parâmetro no “registro()”O método corresponde à propriedade do objeto e o outro refere -se ao seu valor correspondente.
  • Como resultado, as propriedades e os valores do objeto serão registrados no console.

Saída

Na saída acima, pode -se observar que as propriedades do objeto e os valores correspondentes são exibidos no console.

para… de loop

Vamos verificar a iteração do “para de”Faça um loop sobre o objeto.

Dê uma olhada no seguinte código JavaScript:

No trecho de código acima, execute as seguintes etapas:

  • Lembre -se das etapas para criar um objeto no exemplo anterior.
  • Na próxima etapa, aplique o “para de”Faça um loop de maneira semelhante ao iterar ao longo das propriedades do objeto e dos valores correspondentes.
  • Isso resultará em lançar um erro que pode ser visto na saída abaixo.

Saída

Da saída acima, pode -se observar que o objeto acessado não é iterável.

Conclusão

O "para de”O loop pode ser utilizado para dar um loop sobre as cordas e o“para… in”O loop pode ser adequado para loop sobre objetos em JavaScript. O ex -loop acessa diretamente os personagens contidos em uma string e os devolve. O último loop pode ser utilizado para fazer um loop sobre objetos para acessar suas propriedades e os valores correspondentes convenientemente. Este tutorial explicou as diferenças entre para ... em e para… de loop.