Dúvida sobre o método forEach()

Front-end JavaScript
#1

No programinha a seguir, a gente passa o número como argumento no comando console.log(quadrado(3)) para a função reconhecer quem vai ser o parâmetro e poder retornar o quadrado do número (que resultará em 9) para que possamos exibi-lo, certo?

Até aí tudo bem. Mas, nesse outro programinha a seguir - onde há uma função que recebe por parâmetro cada elemento do array chamado meuArray, o índice de cada elemento desse array e o próprio array inteiro e que irá exibir todos esses itens através do método forEach() - como o JavaScript consegue detectar os parâmetros índice, elemento e array sendo que a gente não passou nenhum valor para essa função como argumento no momento em que a invocamos?

#2

Leia forEach da seguinte forma: “forEach recebe como parametro uma funcao x, sendo que funcao x aceita um parametro”. Dessa forma, as implementacoes seguintes sao equivalentes:

  1. Com funcao “inline” (ou anonima):
a = [1, 2]; a.forEach(e => alert(e))
  1. Com uma funcao nao-inline:
a = [1, 2]; function display(val) { alert(val) }; a.forEach(display);
1 curtida
#3

Desculpe, não entendi direito, visto que sou bastante leigo em programação. Eu refiz a minha postagem para ficar um pouco mais fácil e que eu consiga compreender a sua resposta. Se puder refazê-la por gentileza, irei ficar muito grato.

#4

Se voce vem de Java, talvez Javascript soe meio “magico” nesse sentido :). Basicamente em JS vc tem parametros opcionais e pode inclusive dizer qual o valor default. O mais facil eh ir direto na fonte:

Lah voce encontra essa documentacao:

Syntax
arr.forEach(function callback(currentValue[, index[, array]]) {
//your iterator
}[, thisArg]);

Ou seja, o foreach espera como parametro uma funcao (function callback). Essa funcao vai receber o primeiro argumento obrigatoriamente (currentValue) e “pode” receber os argumentos (opcionais marcados com []) index e array como segundo e terceiro. Se voce passar uma funcao que recebe apenas um parametro, os dois ultimos serao ignorados.

1 curtida
#5

Experimenta esse codigo, acho que fica mais claro:

Todos

a = ["nome1", "nome2"]; a.forEach((currentElement, index, array) => alert(`currentElement: ${currentElement}, index: ${index}; array: ${array}`))

Dois primeiros

a = ["nome1", "nome2"]; a.forEach((currentElement, index) => alert(`currentElement: ${currentElement}, index: ${index}`))

Soh o primeiro

a = ["nome1", "nome2"]; a.forEach((currentElement) => alert(`currentElement: ${currentElement}`))
1 curtida
#6

O que significa esse => ?

#7

Isso significa que voce esta criando uma funcao “inline”. No meu primeiro post eu postei uma inline e uma externa pra comparar:

Com funcao “inline” (ou anonima):

a = [1, 2]; a.forEach(e => alert(e))

Com uma funcao nao-inline:

a = [1, 2];

function display(val) {
    alert(val);
}

a.forEach(display);
1 curtida
#8

Acho que estou quase entendendo.

Só não entendi nesse meu exemplo do forEach():

como que o JavaScript conseguiu detectar que o element se trata do elemento do valor, o index se trata do índice e o array se trata do array inteiro durante a função apenas com essas variáveis.

Por exemplo, acabei de fazer esse código e ele também está funcionando certinho, com o JavaScript entendendo do mesmo jeito que o parâmetro a se trata do elemento, o b se trata do índice e o c se trata do vetor em si.

#9

Ele detecta pela ordem dos parametros. Do mesmo jeito que voce copia um arquivo assim:

cp origem destino

O arquivo de origem eh sempre o primeiro e o destino eh o segundo. No caso de foreach, o primeiro eh o elemento, o segundo o indice e o terceiro a array que esta iterando.

1 curtida
#10

Obrigado, agora entendi certinho!