Maneira mais rápida de percorrer array em JavaSCript

Neste artigo você vai aprender qual a maneira mais rápida de percorrer array em JavaScript, vamos utilizar algumas formas diferentes.

Fala programador(a), beleza? Bora aprender mais sobre loops em arrays!

Hoje vamos falar sobre qual a maneira mais rápida de percorrer um array em JavaScript.

Isso é uma tarefa comum em programação, e é importante saber qual a maneira mais eficiente de fazer isso para que o seu código execute de maneira mais rápida e com menos recursos.

Existem algumas formas de percorrer um array em JavaScript, e vamos ver algumas delas a seguir.

1. Utilizando o loop for

O loop for é uma forma simples e rápida de percorrer um array em JavaScript.

Ele permite iterar sobre o array elemento por elemento, e é muito útil para tarefas simples como imprimir os elementos do array ou somar os valores de um array numérico.

Por exemplo, vamos supor que temos um array numbers e queremos imprimir os elementos do array:

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

for (let i = 0; i < numbers.length; i++) {
  console.log(numbers[i]);
}

// Output:
// 1
// 2
// 3
// 4
// 5

No exemplo acima, utilizamos o loop for para iterar sobre o array numbers elemento por elemento. Utilizamos a propriedade length do array para saber quantos elementos o array possui, e utilizamos a variável i como índice para acessar cada elemento do array.

Formação Recomendada

Formação Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

• 474 aulas
• 20 projetos
• 39h 27min

Conhecer formação

2. Utilizando o loop for...of

Outra forma de percorrer um array em JavaScript é utilizando o loop for...of. O loop for...of é uma sintaxe mais moderna e mais simples do que o loop for, e ele permite iterar sobre o array elemento por elemento de maneira mais clara e legível.

Por exemplo, vamos supor que temos um array numbers e queremos imprimir os elementos do array:

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

for (const number of numbers) {
  console.log(number);
}

// Output:
// 1
// 2
// 3
// 4
// 5

No exemplo acima, utilizamos o loop for...of para iterar sobre o array numbers.

3. Utilizando o método forEach

Outra forma de percorrer um array em JavaScript é utilizando o método forEach.

O método forEach é um método de todos os arrays em JavaScript, e ele permite iterar sobre o array elemento por elemento de maneira mais simples e legível.

Por exemplo, vamos supor que temos um array numbers e queremos imprimir os elementos do array:

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

numbers.forEach(function(number) {
  console.log(number);
});

// Output:
// 1
// 2
// 3
// 4
// 5

No exemplo acima, utilizamos o método forEach para iterar sobre o array numbers elemento por elemento.

O método forEach recebe uma função como argumento, e essa função é executada para cada elemento do array.

Utilizamos então uma função anônima como argumento do método forEach, e essa função recebe o elemento atual como parâmetro.

Dentro da função, podemos fazer qualquer coisa com o elemento, como imprimi-lo, somá-lo a um total, etc.

O método forEach é uma forma simples e legível de percorrer um array, e é uma boa opção quando você quer fazer alguma coisa com cada elemento do array sem precisar se preocupar com índices ou condições de parada.

E qual é a estrutura de repetição mais performática em JavaScript?

Quando se trata de performance, o loop for é geralmente a estrutura de loop mais rápida em JavaScript.

Isso porque o loop for é uma estrutura de loop mais simples e otimizada para essa tarefa, e ele não precisa fazer tantas verificações quanto os outros loops.

No entanto, é importante lembrar que a performance não é tudo, e que é sempre importante escrever código legível e fácil de entender.

Se você precisa de uma forma mais legível de percorrer um array, pode ser mais adequado utilizar o loop for...of ou o método forEach.

Deixe um comentário contando o que achou deste artigo 🙂

Quer aprender mais sobre JavaScript? Confira o vídeo abaixo:

Conclusão

Percorrer um array em JavaScript é uma tarefa comum, e existem diversas formas de fazer isso.

No artigo, vimos três formas diferentes: utilizando o loop for, utilizando o loop for...of e utilizando o método forEach.

Qual dessas formas é a mais adequada para o seu caso dependerá do que você precisa fazer e do seu gosto pessoal.

Em geral, o loop for é a forma mais rápida de percorrer um array em JavaScript, seguido pelo loop for...of e pelo método forEach.

No entanto, é importante lembrar que a legibilidade do código também importa.

Está buscando a sua primeira vaga como Programador? Confira o nosso treinamento completo clicando aqui.

Uma plataforma de cursos com projetos completos, comunidade de alunos e muito mais!

Há também o nosso canal no YouTube, com muito conteúdo gratuito de qualidade!

4. Utilizando o loop while

O while também dá pra percorrer array, e ele roda enquanto a condição que tu define for verdadeira

É útil quando tu não sabe de cara quantas voltas vai dar, ou quando a parada depende de algo além do tamanho do array

let i = 0;

while (i < numbers.length) { i++; }

Aqui a gente controla o índice na mão com o i, e incrementa ele a cada volta

Tome cuidado: se tu esquecer de incrementar o i, o while nunca chega no fim e trava tudo (o famoso loop infinito)

5. Utilizando o método map

O map é parecido com o forEach, mas com uma diferença importante: ele RETORNA um novo array com o resultado da função aplicada em cada elemento

Ou seja, tu usa forEach quando só quer fazer algo com cada item, e usa map quando quer transformar o array em outro

const dobro = numbers.map(function(number) { return number * 2; });

console.log(dobro);

// Output:

Repara que o array original numbers continua intacto, o map cria um novo

Se liga: se tu só quer imprimir os elementos e não vai usar o retorno, o forEach é mais adequado que o map

Qual forma usar em cada caso?

Pra não ficar decoreba, o resumo é esse:

for: quando tu precisa de controle total do índice ou de performance no processamento de arrays grandes

for…of: quando quer ler os elementos de um jeito limpo e legível, sem se preocupar com índice

forEach: quando quer executar algo em cada elemento e não precisa do retorno

map: quando quer transformar o array e gerar um novo a partir dele

while: quando o número de voltas não é fixo e depende de uma condição

Não existe o ‘certo’ universal, existe o que encaixa no que tu precisa fazer

Perguntas frequentes sobre percorrer array em JavaScript

Qual a diferença entre forEach e map? O forEach só executa uma função pra cada elemento e não devolve nada, o map devolve um array novo com o resultado da transformação. Se tu vai aproveitar o retorno, usa map, se não, forEach

O loop for é sempre mais rápido? Na maioria dos casos de arrays grandes o for costuma levar vantagem por ser mais simples e otimizado, mas pra tarefas pequenas a diferença é irrelevante e a legibilidade pesa mais

Dá pra parar o forEach no meio? Não do jeito que tu para um for com break. O forEach vai até o fim do array. Se tu precisa interromper no meio, o for ou o for…of são a escolha certa

Qual a diferença entre for…of e for…in? O for…of percorre os valores do array, o for…in percorre as chaves (índices) e é mais indicado pra objetos. Pra array, prefira o for…of