Aprenda Iterando Sobre Arrays com For Loop

A manipulação adequada de arrays começa com loops!

Você já sabe o que são arrays e que a indexação nelas começa do zero. Também sabe que, em um loop for, podemos atribuir qualquer valor à variável i. Por exemplo, zero! Mas e se for conveniente usar um loop for junto com um array? Vamos pensar sobre isso:

Se precisamos recuperar um elemento do array, usamos array[index];;
Temos a variável i, que efetivamente substitui nosso índice;
Combinando os dois pontos acima, podemos concluir que podemos usar a sintaxe array[i] dentro de um loop for para trabalhar rapidamente com um array. Vamos ver um exemplo:


              12345
            
let array: number[] = [2, 4, 6, 1, 7, 1, 4, 77, 23, 0];

for (let i: number = 0; i < 10; i++) {
    console.log(`The ${i} element in the array is ${array[i]}`)
}

Vamos analisar o que está acontecendo no código acima:

Criamos um array do tipo number com 10 elementos;
O objetivo é inspecionar cada elemento do array e identificar em qual índice ele está localizado;
Como a indexação no array começa em 0, nossa variável i inicialmente tem valor 0. Também definimos o limite igual ao comprimento do array, que é 10;
Sabendo que i é o índice do elemento, recuperamos os elementos do array e os exibimos na tela usando array[i];;
Como i é o índice do elemento no array, mostramos imediatamente em qual índice determinado elemento está localizado.

Dessa forma, podemos interagir com o array. Vamos propor uma tarefa diferente: recuperar cada elemento localizado em um índice par deste array:


              12345
            
let array: number[] = [2, 4, 6, 1, 7, 1, 4, 77, 23, 0];

for (let i: number = 0; i < 10; i+=2) {
    console.log(`The ${i} element in the array is ${array[i]}`)
}

Ao utilizar i+=2, que é equivalente a i = i + 2, obtemos todos os elementos do array que estão localizados em índices pares. Em outras palavras, o índice do elemento deve ser divisível por 2. Esses índices são 0, 2, 4, 6 e assim por diante. Observe também que, com i, é possível exibir o índice do elemento, como feito no exemplo acima.

Além disso, não é necessário contar manualmente o tamanho do array! É possível utilizar a propriedade array.length. Veja um exemplo e, ao mesmo tempo, observe como percorrer o array do final para o início (caso seja necessário iterar pelo array em ordem reversa).


              12345
            
let array: number[] = [2, 4, 6, 1, 7, 1, 4, 77, 23, 0];

for (let i: number = array.length - 1; i >= 0; i--) {
    console.log(`The ${i} element in the array is ${array[i]}`)
}

No exemplo acima, i foi inicializado como array.length - 1 porque array.length é 10, e o último elemento do array possui índice 9. Isso ocorre devido à indexação baseada em zero.

Além disso, é possível utilizar array.length não apenas para a inicialização, mas também na condição. Diversos exemplos podem ser criados a partir disso; basta um pouco de criatividade e casos de uso específicos. Por exemplo:


              123456789
            
let array: number[] = [2, 4, 6, 1, 7, 1, 4, 77, 23, 0];

for (let i: number = 0; i < array.length; i++) {
    if ((array.length - i) % 2 == 0) {
        console.log(`The ${i} element in the array is ${array[i]}`)
    } else {
        console.log("[DELETED DATA]")
    }
}

Se o valor do comprimento do array menos o índice for divisível por 2, exibimos esse elemento. Caso contrário, exibimos 'DELETED DATA' - ordens do chefe.

Tudo estava claro?

Obrigado pelo seu feedback!

Seção 4. Capítulo 6

Pergunte à IA

Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo

Suggested prompts:

Can you explain how the last code example works in more detail?

What are some other ways to loop through an array in TypeScript?

Can you show how to use a for...of loop with arrays?

Awesome!

Completion rate improved to 2.94

Deslize para mostrar o menu