What's the difference between For, ForEach and Find in JavaScript?

7

What's the difference between the 3?

For , ForEach , and Find

    
asked by anonymous 24.01.2018 / 17:24

2 answers

9

for is one of the most basic ways to create loops in the language, along with while and do..while . It allows you to repeat a snippet of code a certain number of times, usually based on a counter and a stop condition based on the value of that counter. For example:

for (var i=0; i<10; i++) {
    // o que estiver aqui será executado
    // 10 vezes (de i=0 até i=9)
}

It is heavily used for iterating arrays (which seems to be the use case you have in mind). Example:

var lista = ['maçã', 'banana', 'pera'];
for (var i=0; i<lista.length; i++) {
    console.log(lista[i]);
}

Already forEach and find are methods of arrays. The first one is equivalent to using a for loop by traversing the array from the first to the last index, and executing a callback function that receives the current element:

var lista = ['maçã', 'banana', 'pera'];
lista.forEach(function(item) {
    console.log(item);
});

While find , as the name implies, is used to find a specific element within the array. It has a syntax similar to that of forEach , and returns the first element of the array that meets the given condition defined in callback . For example:

// Queremos o primeiro número par da lista
var numeros = [5, 10, 15, 20, 25];
var primeiroPar = numeros.find(function(item) {
    return item % 2 === 0;
});
// primeiroPar terá o valor 10

Reliable documentation

24.01.2018 / 17:50
6

The answer from the bfavaretto is correct and it is good. I'll complement.

The for (which I hate that followed by the opening parenthesis with no space that confuses it as a function) is a statement , is used so imperative . It tells you what to do. And it has all its own syntax.

It has variations ( more ) in newer versions of EcmaScript that make this form almost obsolete in most situations.

The other two are functions, you call it to execute. She knows what to do in there. You must pass at least one anonymous function with the algorithm you want to perform on each item. In the case of forEach() it will only execute that, and in find() the code must result in a Boolean to decide if it should take the item being analyzed.

It works as a callback , that is, you pass a function as an argument of another function, this calls the function that you passed in the moment that it understands adequate according to the need and what it intends to do.

This mode is more functional because it delegates to a function like doing, you're just saying what to do, it's a more declarative , although in JavaScript it is only possible to determine what to do in your detail imperative.

This way is always slower . And most of the time it causes less confusion. Understanding scope in anonymous functions ( closure is much harder), and in some cases until you find the right algorithm becomes more complicated, especially when you have to keep state between items being evaluated.

Newer versions allow the use of lambda syntax for the function anonymous.

Useful information:

24.01.2018 / 18:22