-1

Estou aprendendo JavaScript, e estava recriando a função tipo forEach (usando um laço for) dentro de prototype de um array. E para isso utilizei uma função callback, abaixo:

Array.prototype.forEach2 = function (callback) {
    for (let i = 0; i < this.length; i++) {
        callback(this[i], i, this)
        // para uma função 'callback' você deve passar três parâmetros: 
    }
}

Quero entender porque temos que passar 3 parâmetros para as funções callback, que são: o valor, o índice, e o array completo.

2
  • 1
    Você não precisa passar necessariamente três parâmetros, você pode passar quantos (e quais) quiser, também pode passar apenas os que você irá utilizar. Commented 2/09/2018 às 21:05
  • 1
    Obrigado @LeonardoSantos. E neste caso a callback usou três parâmetros porque são todos os atributos necessários para retornar o valor do loop 'for' (valor, índice, e o próprio Array), isso?
    – Brevvi
    Commented 2/09/2018 às 21:37

2 Respostas 2

3

Você fez o código, você tem que explicar porque quer passar 3 argumentos.

Sabe que aí para usar direito terá que passar funções que esperam essas 3 informações e que usam de forma adequada.

Provavelmente leu isso em algum lugar. Sempre que for aprender por fontes que não dizem porque fizeram aquilo entenda que a fonte é ruim.

E entenda que criar abstrações sem necessidade não é vantajoso, essa mesma é desnecessária. Vou entender que está fazendo só para aprender outra coisa, mas é bom deixar claro, até para outras pessoas não caírem nesta armadilha.

O que eu posso especular é que está querendo passar para a função a ser chamada os dados constantes aí, ou seja, o elemento sendo analisado naquele passo, o índice dele e o objeto como um todo sendo analisado. Desta forma dá uma certa liberdade para a função fazer o que for necessário. Mas um for simples seria mais útil.

Especulei porque eu conheço a forEach() original e é isso que ela faz. E é uma das piores funções do JS. Você economiza uns caracteres e perde performance e cria complicadores se precisar modificar o código, fora que é muito fácil se confundir com escopo fazendo isso (vejo quase todo mundo errando nisso).

Então a resposta para isso é que passa esses argumentos porque tudo isso não deveria ser feito. Quando não se sabe onde quer chegar, qualquer caminho serve. Exemplos de aprendizado devem ter um motivador real, mesmo que seja um problema fictício. Desenhar aplicações depende do contexto, sem um ou com um errado aprende-se errado.

2
  • Realmente é de se pensar: "Sempre que for aprender por fontes que não dizem porque fizeram aquilo entenda que a fonte é ruim."
    – rbz
    Commented 2/09/2018 às 22:01
  • Obrigado pelo retorno, @Maniero. O exemplo acima foi uma segunda parte da explicação do forEach, demonstrando que a mesma poderia ser reconstruída. Sem antes ver a resposta eu tinha tentando reconstruí-la com uma função utilizando um laço for, mas não consegui chamar essa função que criei com a pontuação na array (por exemplo, "nomeDaArray.nomaDaFunção...") simulando o forEach. No processo aprendi que utilizando o prototype seria possível fazer isso. Mas não havia entendido direito o conceito da função callback e sua parametrização.
    – Brevvi
    Commented 2/09/2018 às 22:53
1

Como o JavaScript é uma linguagem em que não é preciso especificar o tipo do dado que você espera receber no argumento passado para a função (nesse caso você chamou o argumento de callback) o código que usa esse argumento precisa fazer essa checagem ou então pode ocorrer um erro quando ele estiver utilizando esse argumento.

No seu código, você espera que o argumento callback seja um variável do tipo função e essa função receba 3 argumentos: o elemento do array, o índice do array e o próprio array. O código define a assinatura dessa forma porque provavelmente ele foi baseado no código do método forEach.

Por que está fazendo dessa forma? Porque você espera que o usuário dessa função forEach2 a utilize da seguinte forma: umArrayQualquer.forEach2(function (v, i, arr) { ... });

Assim, quando for utilizado, a função será passada no argumento callback e internamente vai fazer a chamada para a função corretamente.

O JavaScript é esperto o suficiente para que o usuário da sua função possa ter uma assinatura mais simples como umArrayQualquer.forEach2(function (v) { ... }); e funcionar sem erro o seu código que faz a chamada, mas imagine que o usuário da sua função não utilize dessa forma. Se ele fizer a chamada assim: umArrayQualquer.forEach2(123);. Ao invés de passar uma função que espera 3 argumentos, passou um número. Isso vai causar um erro no seu código.

Array.prototype.forEach2 = function (callback) {
    for (let i = 0; i < this.length; i++) {
        callback(this[i], i, this)
    }
}

var umArrayQualquer = [1, 3, 4];

console.log("com função completa");
umArrayQualquer.forEach2(function (v, i, arr) {
   console.log(v);
});

console.log("com função simplificada");
umArrayQualquer.forEach2(function (v) {
   console.log(v);
});

console.log("com argumento errado");
umArrayQualquer.forEach2(123);

Por esse motivo, sempre que você está estendendo uma classe é importante fazer checagens dentro do código para garantir que o usuário da sua função não provoque um erro imprevisto.

Array.prototype.forEach2 = function (callback) {
    if (typeof callback === 'function')
      for (let i = 0; i < this.length; i++) {
          callback(this[i], i, this)
      }
}

var umArrayQualquer = [1, 3, 4];

console.log("com função simplificada");
umArrayQualquer.forEach2(function (v) {
   console.log(v);
});

console.log("com argumento errado");
umArrayQualquer.forEach2(123);

É claro que eu coloquei um exemplo bem extremo e como provavelmente você mesmo faria uso da sua extensão, não cometeria esse tipo de erro ao usar, mas coloquei aqui apenas para ilustrar que é importante você fazer checagens para evitar erros por conta dessa falta de tipagem do JavaScript.

Você precisaria fazer sempre dessa forma, passando os mesmos valores que o forEach recebe? Não. Como você está estendendo a classe Array você pode definir os argumentos da forma que precisa para atender a sua necessidade. Se você estiver estendendo porque seu código vai ser usado por outras pessoas, então é interessante manter o padrão porque o usuário do código vai esperar que uma versão diferente de um forEach tenha características semelhantes de uso.

O nome que você dá para a sua função também é importante. Se você chamar de forEach2 é uma boa dica para quem for usar entender que é semelhante a um forEach, e se você implementa com algo completamente diferente estará atrapalhando quem vai usar a função. Então uma dica é sempre que for estender uma classe existente procure estudar a classe primeiro, quais métodos ela tem e como funcionam, principalmente para você não reinventar a roda.

1
  • Perfeito, @pagotti ! Seus comentários foram bem claros. Consegui entender conceitos que não tinha observado antes. Obrigado pela resposta.
    – Brevvi
    Commented 4/09/2018 às 2:13

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .