Qual é mais rápido no mapa JavaScript vs. forEach?

May 04 2023

Ambos map() e forEach() são métodos de array em JavaScript que são usados para iterar sobre cada item em um array. No entanto, eles têm funcionalidades diferentes e, portanto, funcionam de maneira diferente em determinados cenários.

Ambos map()e forEach()são métodos de array em JavaScript usados para iterar sobre cada item em um array. No entanto, eles têm funcionalidades diferentes e, portanto, funcionam de maneira diferente em determinados cenários. Neste artigo, exploraremos as diferenças entre map()e forEach()e como eles afetam o desempenho.

o `map()`método

O map()método é usado para criar uma nova matriz executando uma função em cada elemento da matriz existente. Ele retorna um novo array com o mesmo número de elementos do array original, onde cada elemento é o resultado da função aplicada ao elemento correspondente no array original.

Aqui está um exemplo de como map()dobrar cada número em uma matriz:

const originalArray = [1, 2, 3, 4, 5];
const doubledArray = originalArray.map((num) => num * 2);
console.log(doubledArray); // Output: [2, 4, 6, 8, 10]

o `forEach()`método

O forEach()método é usado para executar uma função em cada elemento de um array. Ele não cria uma nova matriz como map()faz, mas executa uma ação em cada elemento da matriz existente.

Aqui está um exemplo de uso forEach()para registrar cada item em uma matriz:

const originalArray = ['apple', 'banana', 'orange'];
originalArray.forEach((item) => console.log(item));
// Output: "apple", "banana", "orange"

Diferenças de desempenho

Embora ambos map()e forEach()executem ações semelhantes, existem algumas diferenças importantes em seu desempenho.

Uma diferença significativa é que map()retorna um novo array, enquanto forEach()não retorna. Isso significa que, se você precisar criar uma nova matriz com base nos valores de uma matriz existente, map()é a melhor escolha. Por outro lado, se você só precisa executar uma ação em cada elemento de um array e não precisa criar um novo array, forEach()pode ser uma escolha melhor.

Outra diferença é que map()cria um novo array com o mesmo comprimento do array original, mas forEach()não modifica o comprimento do array original. Isso significa que map()pode ser mais lento nos casos em que a matriz resultante não é necessária, pois requer alocação e cópia de memória adicionais.

Em termos de velocidade, geralmente é aceito que forEach()seja mais rápido do que map()para iterações simples, pois forEach()não é necessário criar um novo array. No entanto, isso pode variar dependendo do caso de uso específico e da quantidade de dados sendo processados.

Exemplo

Vamos considerar um exemplo onde temos um array de números e queremos aplicar uma função a cada elemento e retornar um novo array com os resultados. Vamos usar map()e forEach()para conseguir isso e medir o desempenho de cada método.

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

// Using map()
console.time('map');
const doubledNumbersMap = numbers.map((num) => num * 2);
console.timeEnd('map');

// Using forEach()
console.time('forEach');
const doubledNumbersForEach = [];
numbers.forEach((num)
{
doubledNumbersForEach.push(num * 2);
});
console.timeEnd('forEach');

console.log(doubledNumbersMap); // Output: [2, 4, 6, 8, 10]
console.log(doubledNumbersForEach); // Output: [2, 4, 6, 8,

Quando executamos esse código, obtemos a seguinte saída:

map: 0.012939453125ms
forEach: 0.007080078125ms

*Conclusão**

Em conclusão, `map()` e `forEach()` são métodos de array úteis em JavaScript que executam ações semelhantes, mas têm funcionalidades diferentes. `map()` cria um novo array baseado nos valores de um array existente, enquanto `forEach()` executa uma ação em cada elemento de um array sem criar um novo array.

Em termos de desempenho, `forEach()` é geralmente mais rápido que `map()` para iterações simples, já que não cria um novo array. No entanto, isso pode variar dependendo do caso de uso específico e da quantidade de dados sendo processados. Portanto, é importante considerar os requisitos específicos do seu código ao escolher entre `map()` e `forEach()`.

Obrigado por ler!

Espero que você tenha achado este artigo útil. Se você tiver alguma dúvida ou sugestão, por favor, deixe comentários. Seu feedback me ajuda a melhorar.