For JavaScript: como usar esse laço de repetição

Neste texto, vamos explorar o loop de repetição for JavaScript e aprender como utilizá-lo. Além disso, veremos exemplos práticos de uso e também abordaremos como evitar erros comuns, como loops infinitos. 

O for serve para fazer loops. Ou seja, iterações condicionais. Enquanto uma condição for cumprida, haverá um loop com uma sequência de comandos.

Continue a leitura e saiba como usá-lo.

Artigos relacionados:

O que é for JavaScript?

O “for” em JavaScript é uma estrutura de controle que permite criar loops e repetir um conjunto de instruções várias vezes. Tudo ocorre, enquanto uma condição for cumprida.

Dessa maneira, ele é útil para automatizar tarefas repetitivas.

A estrutura do “for” é composta por três partes:

  1. Inicializar: Definimos uma variável contador e atribuímos a ela um valor inicial, geralmente 0 ou 1;
  2. Condição: Verificamos uma expressão lógica a cada iteração do loop. Enquanto a condição for verdadeira, o loop continua;
  3. Incremento/Decremento: Modificamos a variável contador a cada iteração, geralmente usando os operadores de incremento (++) ou decremento (–).

O fluxo de execução do “for” é o seguinte:

  1. Executa a inicialização para configurar o contador;
  2. Verifique se a condição é verdadeira. Se for, continue para o próximo passo. Caso contrário, encerre o loop.
  3. Execute o bloco de código no interior do loop. Esse bloco contém as instruções a serem repetidas;
  4. Executa o incremento/decremento para atualizar o contador;
  5. Volta ao passo 2 para verificar novamente a condição; o loop continua até que a condição se torne falsa.

O “for” tem amplo uso em JavaScript e outras linguagens de programação. Ele percorre arrays, executa operações matemáticas repetitivas, cria listas dinamicamente e muito mais. 

Em conclusão, é uma ferramenta fundamental para programadores que desejam realizar tarefas repetitivas de maneira eficiente e organizada.

Sintaxe do for JavaScript

Usar o loop "for" em JavaScript é uma habilidade fundamental para realizar tarefas repetitivas e processar listas de dados de forma eficiente.

O loop “for” é uma estrutura de controle que nos permite executar um bloco de código várias vezes. Tudo com base em uma condição específica. Na seção de introdução, vimos que ele é composto por três partes essenciais.

Aqui está a estrutura básica do loop “for”:

for (inicialização; condição; atualização) {

  // Bloco de código a ser repetido

}

Como usar o loop for JavaScript

for (let i = 1; i <= 5; i++) {

  console.log(i);

}

saída:

1

2

3

4

5

Erros comuns ao usar o loop for

O loop "for" é uma ferramenta poderosa em JavaScript, mas também pode ser fonte de erros se não for utilizado corretamente. Vamos explorar alguns erros comuns que as pessoas cometem ao usar o loop "for" e como evitá-los, de forma clara e didática!

Esquecer de inicializar a variável de controle adequadamente: Um erro comum é esquecer de inicializar corretamente a variável de controle do loop. 

Certifique-se, no entanto, que a variável esteja devidamente inicializada antes do início do loop. Para evitar problemas, certifique-se de que o loop seja executado corretamente, sem ocorrer loops infinitos.

// Exemplo incorreto

for (i = 0; i < 5; i++) {

  console.log(i);

}

// Exemplo correto

for (let i = 0; i < 5; i++) {

  console.log(i);

}

Definir uma condição que nunca será verdadeira ou sempre será verdadeira. Outro erro comum é criar uma condição que nunca será verdadeira ou sempre será verdadeira. Pois isso leva a um loop que nunca termina ou que termina sem executar o bloco de código dentro dele.

// Exemplo incorreto (loop infinito)

for (let i = 0; i > -1; i++) {

  console.log(i);

}

// Exemplo incorreto (loop não executado)

for (let i = 0; i < 5; i--) {

  console.log(i);

}

Não atualizar corretamente a variável de controle. Se a variável de controle não for atualizada corretamente dentro do loop, isso pode levar a um loop infinito. Isso ocorre, pois a condição do loop nunca se tornará falsa.

// Exemplo incorreto

for (let i = 0; i < 5; i) {

  console.log(i);

  // Esqueceu de incrementar i com i++

}

// Exemplo correto

for (let i = 0; i < 5; i++) {

  console.log(i);

}

Evite modificar a variável de controle dentro do loop, pois isso pode causar resultados inesperados ou comportamentos indesejados.

// Exemplo incorreto

for (let i = 0; i < 5; i++) {

  console.log(i);

  i = i + 2; // Modificar a variável de controle dentro do loop

}

// Exemplo correto

for (let i = 0; i < 5; i++) {

  console.log(i);

  // Outras operações dentro do loop, mas não modificar a variável de controle

}

Usar o mesmo nome de variável fora do loop. Se você usar o mesmo nome de variável fora do loop e dentro dele, isso pode causar comportamentos inesperados. Isso ocorre, pois o escopo da variável será diferente dentro e fora do loop.

// Exemplo incorreto

let i = 0;

for (let i = 0; i < 5; i++) {

  console.log(i);

}

// Exemplo correto

for (let i = 0; i < 5; i++) {

  console.log(i);

}

Evite esses erros comuns e seguir as práticas recomendadas. Dessa forma, você poderá utilizar o loop “for” de forma eficaz e segura em seus programas JavaScript. 

Lembre-se de sempre testar e depurar seu código para garantir que ele funcione corretamente em diferentes cenários. Com a prática, você se tornará mais proficiente no uso do loop "for" e em programação em geral!

Exemplos de uso do loop for em JavaScript

Exploraremos alguns exemplos práticos de uso do loop "for" em JavaScript para diferentes situações. Vou explicar cada exemplo passo a passo de forma clara e didática.

Exemplo 1: Imprimir números de 1 a 5 no console

for (let i = 1; i <= 5; i++) {

  console.log(i);

}

Neste exemplo, utilizamos o loop “for” para imprimir os números de 1 a 5 no console. Inicializamos a variável “i” com o valor 1. O loop executa enquanto “i” for menor ou igual a 5.

A cada iteração, imprimimos o valor de “i” no console e incrementamos “i” em 1.

Resultado:

1

2

3

4

5

Exemplo 2: Calcular a soma dos primeiros 10 números naturais

let soma = 0;

for (let i = 1; i <= 10; i++) {

  soma += i;

}

console.log("A soma dos primeiros 10 números naturais é: " + soma);

Neste exemplo, usamos o loop “for” para calcular a soma dos primeiros 10 números naturais (1 + 2 + 3 + ... + 10). Inicializamos a variável “soma” com 0. Em cada iteração, adicionamos o valor de “i” à variável “soma”. O loop continuará até que “i” seja menor ou igual a 10.

Resultado:

A soma dos primeiros 10 números naturais é: 55

Exemplo 3: Percorrer e manipular um array

const frutas = ["maçã", "banana", "laranja", "uva", "melancia"];

for (let i = 0; i < frutas.length; i++) {

  console.log("Eu gosto de " + frutas[i]);

}

Neste exemplo, utilizamos o loop “for” para percorrer um array de frutas e imprimir uma mensagem para cada uma delas. Começamos com “i” igual a 0 e o loop continuará enquanto “i” for menor que o tamanho do array. 

A cada iteração, acessamos o elemento do array na posição “i” e o concatenamos à mensagem.

Resultado:

Eu gosto de maçã

Eu gosto de banana

Eu gosto de laranja

Eu gosto de uva

Eu gosto de melancia

Quando usar o loop for

O loop "for" é uma escolha ideal para execução repetida de código com base em uma condição específica e controle preciso do número de iterações. Vamos agora analisar situações em que o loop "for" é mais apropriado.

Quando você precisa iterar sobre arrays ou listas, o loop "for" é amplamente utilizado. Ele permite percorrer sequencialmente todos os elementos e realizar operações com cada um deles. Essa abordagem é especialmente útil quando você precisa acessar elementos de forma ordenada.

const numeros = [1, 2, 3, 4, 5];

for (let i = 0; i < numeros.length; i++) {

  console.log(numeros[i]);

}

Contagem ou sequências numéricas: Quando você precisa realizar uma contagem ou criar uma sequência numérica, o loop "for" é uma excelente escolha. Ele permite que você defina o valor inicial, a condição de parada e o incremento ou decremento, tornando a contagem ou sequência personalizada.

Exemplo:

for (let i = 0; i < 5; i++) {

  console.log("Executando tarefa " + (i + 1));

}

O loop "for" é especialmente útil para manipular dados indexados, como strings. Essa estrutura permite que você acesse cada caractere individualmente ou execute ações em posições específicas. Isso torna a manipulação de strings mais eficiente e facilita a implementação de operações específicas em cada elemento.

Exemplo:

const palavra = "JavaScript";

for (let i = 0; i < palavra.length; i++) {

  console.log(palavra[i]);

}

As aplicações matemáticas ou cálculos iterativos frequentemente utilizam o loop “for”. Nesse tipo de cenário, você executa cálculos iterativos ou sequenciais para resolver problemas específicos.

Exemplo:

let soma = 0;

for (let i = 1; i <= 10; i++) {

  soma += i;

}

console.log("A soma dos primeiros 10 números naturais é: " + soma);

Em resumo, o loop “for” é apropriado quando se necessita de repetição com controle preciso do número de iterações. Ele é especialmente útil ao percorrer arrays, realizar contagens, manipular strings e executar tarefas repetitivas conhecidas.

No entanto, é importante considerar outras estruturas de controle. Por exemplo, como “for…of” ou “while”, quando as necessidades do seu código forem diferentes ou menos previsíveis. Ao dominar o uso adequado do loop “for”, você desenvolvedor JavaScript adquire uma habilidade essencial!

Como evitar loops infinitos

Evitar loops infinitos é crucial para garantir que o seu código funcione corretamente e não trave a execução do programa. 

Um loop infinito ocorre quando a condição do loop nunca se torna falsa, fazendo com que ele continue sendo executado para sempre. Vamos explorar algumas estratégias para evitar loops infinitos, de forma clara e didática.

Para evitar loops infinitos, é fundamental verificar corretamente a condição de parada do loop. Certifique-se de que a condição possa se tornar falsa em algum momento durante a execução do loop. Certifique-se de que a condição possa ser falsa em algum momento durante a execução do loop.

Exemplo de loop infinito:

let i = 0;

while (i < 5) {

  console.log(i);

  // Esqueceu de incrementar a variável de controle "i"

}

Atualizar a variável de controle. Se você está usando uma variável de controle para controlar o loop, certifique-se de atualizá-la corretamente dentro do bloco do loop. Caso contrário, pode nunca alcançar a condição de parada.

Exemplo de loop infinito:

for (let i = 0; i < 5; i) {

  console.log(i);

  // Esqueceu de incrementar a variável de controle "i"

}

Evitar condições que sempre são verdadeiras: Tenha cuidado com condições que sempre são verdadeiras. Por exemplo, nunca use “while (true)” ou “for (;;)”. Sem uma condição de parada adequada, o loop continuará infinitamente.

Exemplo de loop infinito:

while (true) {

  console.log("Este loop nunca vai parar!");

}

Usar breakpoints e depuração: Quando estiver desenvolvendo, use breakpoints (pontos de interrupção) e técnicas de depuração para verificar o fluxo do seu programa. Assim, isso permitirá que você identifique loops infinitos e outros problemas de execução.

Testar em cenários variados: Antes de colocar seu código em produção, certifique-se de testá-lo em diferentes cenários e condições. Assim, isso ajudará a identificar loops infinitos e outros bugs que possam ocorrer durante a execução.

Exemplo de loop infinito:

let numero = 10;

while (numero > 0) {

  console.log(numero);

  // Esqueceu de decrementar a variável "numero"

}

Este artigo foi útil?

Obrigado pela resposta!
Picture of Daiana S

Daiana S

Graduada em Letras pelo Instituto Federal da Paraíba e especializada em redação geral. Gosto de escrever sobre tudo e me dedico em vários níveis de expressividade. No geral, todos os meus hobbies giram em torno de escrever alguma coisa e fazer isso bem.

Contato: daiana.blog@homehost.com.br

Ganhe 30% OFF

Indique seu nome e e-mail,e ganhe um cupom de desconto de 30% para sempre na Homehost!