Desenvolvedor de Software e Especialista em Tecnologia da Informação

For + Array em JavaScript: Percorrendo com .length

Em vez de escrever console.log() uma linha pra cada item de um array, existe um jeito de percorrer a lista inteira automaticamente. Neste artigo você vai ver como combinar o loop for com a propriedade length de um array para imprimir todos os itens, não importa quantos sejam . Uma habilidade essencial para qualquer programador que trabalha com listas de dados .

POV: Você percorreu o array inteiro com for e .length 😎🔄

Partindo de um array com três automóveis (Celta, Fusca e Belina), criamos um for começando em i = 0, com a condição "enquanto i for menor que automóveis.length" (o tamanho real do array) e o incremento i++ a cada volta. Usando i como índice dentro do console.log, cada volta do loop imprime um automóvel diferente, concatenando o texto com o nome do carro daquela posição — Celta na primeira, Fusca na segunda e Belina na terceira volta.

For JavaScript Array JavaScript Length JavaScript Percorrer Array Loop for JavaScript para Iniciantes Estruturas de Repetição Programador Iniciante RogerioPontesTI

"O for ele é mais útil quando a gente sabe o tamanho daquilo que a gente tá manipulando. Eu sei que aqui ele tem o tamanho de três e tem o seu índice 0, 1 e 2. Eu vou colocar aqui o nosso i. O i ele vai começar com zero. Depois a gente vai pegar o i. Ele tem que ser menor que automóveis.length. Ou seja, ele vai pegar o tamanho de automóveis e depois a gente vai fazer o nosso incremento."

🔄 Por que usar for com arrays?

Quando você precisa percorrer todos os elementos de um array, o loop for é uma das ferramentas mais poderosas . Ele permite acessar cada item usando seu índice e executar operações repetidamente . A combinação com a propriedade length torna o loop dinâmico e adaptável .

📋 Por que usar length no loop?
  • Dinâmico — se o array crescer ou diminuir, o loop se ajusta automaticamente
  • Evita números fixos — não precisa saber quantos itens tem de antemão
  • Seguro — nunca acessa uma posição que não existe
  • Profissional — é como programadores experientes fazem
FOR COM LENGTH 

const automoveis = ["Celta", "Fusca", "Belina"];

// Percorrendo com for e length
for (let i = 0; i < automoveis.length; i++) {
    console.log("O nome do automóvel é " + automoveis[i]);
}
// Saída:
// O nome do automóvel é Celta
// O nome do automóvel é Fusca
// O nome do automóvel é Belina

🔍 Como funciona o for com length

O loop for é composto por três partes que trabalham juntas para percorrer o array :

ANATOMIA DO FOR 

// for (inicialização; condição; incremento)
for (let i = 0; i < automoveis.length; i++) {
    // Bloco executado em cada iteração
    console.log(automoveis[i]);
}
📖 Passo a passo da execução
  • Inicialização: let i = 0 — começa no primeiro índice
  • Condição: i < automoveis.length — verifica se ainda há itens
  • Bloco: console.log(automoveis[i]) — executa o código
  • Incremento: i++ — avança para o próximo índice

⚖️ .length vs número fixo — qual a diferença?

❌ Número fixo — quebra fácil
// Se o array mudar, o loop quebra
for (let i = 0; i < 3; i++) {
    // Só funciona se o array tiver 3 itens
}
✅ .length — se adapta sozinho
// Funciona com qualquer tamanho
for (let i = 0; i < array.length; i++) {
    // Funciona com 3, 10 ou 1000 itens
}
📖 Por que .length é melhor?
  • Adaptável — o loop se ajusta automaticamente ao tamanho do array
  • Menos erros — evita erros de índice fora do limite
  • Escalável — funciona para arrays de qualquer tamanho
  • Manutenível — não precisa alterar o código quando o array muda

📚 Exemplos práticos

1. Percorrendo uma lista de produtos

EXEMPLO 1 

const produtos = ["Notebook", "Mouse", "Teclado", "Monitor"];

for (let i = 0; i < produtos.length; i++) {
    console.log(`Produto ${i + 1}: ${produtos[i]}`);
}
// Saída:
// Produto 1: Notebook
// Produto 2: Mouse
// Produto 3: Teclado
// Produto 4: Monitor

2. Calculando a soma de um array

EXEMPLO 2 

const numeros = [10, 20, 30, 40, 50];
let soma = 0;

for (let i = 0; i < numeros.length; i++) {
    soma += numeros[i];
}

console.log("Soma total: " + soma); // 150

📋 Boas práticas com for e arrays

1️⃣ Use const para o array

Declare o array com const para evitar reatribuições acidentais .

2️⃣ Use let para o contador

O contador i muda a cada iteração, use let .

3️⃣ Cache o length para performance

Em arrays grandes, armazene array.length em uma variável .

4️⃣ Evite loops infinitos

Sempre atualize o contador para garantir que o loop termine .

⏱️ Capítulos do vídeo

  • 00:00 — Preparando o array: Celta, Fusca e Belina
  • 00:10 — For em JavaScript: quando usar e o índice inicial (0)
  • 00:25 — .length em JavaScript: o for percorrendo o tamanho real do array
  • 00:35 — Incremento (i++): garantindo a progressão do loop
  • 00:39 — Exibindo no console: concatenando o nome de cada automóvel
  • 00:53 — Testando o resultado na tela
  • 00:59 — Encerramento e convite para se inscrever

🎯 Conclusão

A combinação do loop for com a propriedade length é um dos padrões mais poderosos e versáteis em JavaScript . Ela permite percorrer arrays de qualquer tamanho de forma eficiente e adaptável .

Neste artigo, você aprendeu:

  • ✅ Como criar um array com múltiplos valores
  • ✅ Como usar um for para percorrer todos os itens de um array
  • ✅ Como usar a propriedade length como condição do loop
  • ✅ Como usar o índice i para acessar cada posição do array
  • ✅ Como concatenar texto com o valor de cada item
  • ✅ Por que usar .length é melhor do que um número fixo

💡 Lembre-se: Usar .length em vez de um número fixo torna seu código mais robusto e adaptável . Se o array crescer ou diminuir, o loop se ajusta sozinho — essa é a beleza do padrão for + length .

🤔 O que você achou?

💬 Quer aprender JavaScript do ZERO? Comece agora a escrever seu primeiro código e seus fundamentos!

❓ FAQ: Perguntas Frequentes sobre For e Arrays em JavaScript

Porque o for é ideal quando você sabe (ou pode calcular) o tamanho da repetição, permitindo acessar cada elemento pelo índice .

Retorna a quantidade de itens que o array possui, sendo útil para controlar loops e validações .

Porque o loop se ajusta automaticamente se o array mudar de tamanho, tornando o código mais adaptável .

Sim, automóveis[i] retorna o item na posição i a cada repetição, permitindo acesso dinâmico aos elementos .

Geralmente sim, porque o primeiro item de um array está na posição 0, que é a convenção do JavaScript .

O loop nunca termina, entrando em um loop infinito, que pode travar o navegador .

Sim, é exatamente essa a vantagem de usar .length em vez de um número fixo .

Sim, usando o operador + para juntar strings e valores, ou template literals com ${} .

Sim, métodos como forEach(), map() e for...of também permitem percorrer arrays .

Sim, é uma das combinações mais usadas em JavaScript no dia a dia e fundamental para manipulação de listas .

O for oferece controle total sobre o índice e permite break/continue; o forEach é mais declarativo e não permite interrupção .

Use o índice array.length - 1, que sempre aponta para a última posição do array .

🎬 Assista ao Vídeos completo sobre Refatoração

O vídeo foi feito em Javascript mais o conceito pode ser utilizado em qualquer outra linguagem de programação..

🔗 Conecte-se Comigo

YouTube Site LinkedIn GitHub Instagram

💬 Você prefere usar for, forEach() ou map() para percorrer um array? Você sabia por que usar .length é melhor do que colocar o número fixo no for? Escreve aqui nos comentários! 👇

#JavaScript #For #Array #Length #JavaScriptParaIniciantes #RogerioPontesTI