9

O exemplo que vou mostrar aqui é só para ilustrar.

Gostaria de entender de fato como funciona esse e que geralmente é passado como parâmetro em várias funções que encontros em códigos por aí.

 $(".fotos").each(function(e){
                    if(e <= e + 2){
                        teste[posicao][e] = e;

                        if((e+1)%3 == 0){
                            posicao +=1;
                            teste[posicao] = new Array();
                        }

                    }
1
  • 2
    O e era normalmente usado para eventos, ou event. Mas generalizou e todos começaram a usar e, sem de fato entender o porque. Mas não necessariamente precisa chamar e. Commented 25/09/2015 às 14:24

3 Respostas 3

8

Quando usas a API do jQuery para $(".fotos").each esse método aceita uma função como argumento. Essa função é também chamada iterador, ou seja a função que será chamada e corrida para cada um dos $(".fotos") encontrados por esse seletor.

A variável no teu exemplo chama-se e mas podia ser outro nome. O importante é o que ela contém. E no caso do jQuery é o index (indície/posição) desse elemento que está a ser iterado no array, tipo: Number.

Se essa função tivesses dois argumentos o segundo seria o próprio valor, e será o tipo do que estiver dentro da array e a ser iterado, um elemento com classe .foto no teu exemplo.

Nota que o jQuery faz ao contrário da API nativa de JavaScript, que disponibiliza nesse iterador primeiro o valor, e depois o indice.

Mas o (e) é só isso em todos os casos de funções aí pela web?

Bom, não dá para generalizar assim. Porém a variável e é usada muitas vezes como abreviatura para "elemento" ou até "evento".

No teu exemplo, nem devia ser e, semanticamente, mas sim i. Se houvesse dois argumentos eu escreveria .each(function(i, e){ como abreviaturas de .each(function(index, elemento){.

Se fosse outro tipo de função, como uma callback de um oscultador de eventos, o e seria abreviatura de evento. Por exemplo:

$('div.teste').on('click', function(e){
    e.preventDefault(); // aqui "e" é abreviatura de evento e contem o objeto evento
1
  • 2
    +1, e o ponto a respeito de i é bem válido; um parâmetro i é prática comum para índices.
    – OnoSendai
    Commented 25/09/2015 às 14:39
5

Isto é um parâmetro. Um argumento será passado para ele. Imagino que mesmo não sabendo a terminologia correta, saiba para que serve um parâmetro.

Neste caso o e irá receber argumentos enviados pela função each(). Esta função tem por objetivo varrer uma coleção de dados. Então cada membro desta coleção provocará uma chamada à função anônima escrita ali e o elemento da coleção (neste caso, o índice dele) será enviado como argumento.

Na verdade estou descrevendo o que eu sei desta função. Funções que chamam funções anônimas devem documentar bem como a função anônima (que você escreveu) deve ser escrita, que parâmetros ela deve receber, em linhas gerais o que ela deve fazer e o que deve retornar.

E obviamente que você pode escrever uma função sua que receba como argumento uma função anônima. Se fizer isto, tem que documentar como ela será usada.

Vamos ver o fonte da função each():

function (obj, callback) {
    var length, i = 0;
    if (isArrayLike(obj)) {
        length = obj.length;
        for (; i < length; i++) if (callback.call(obj[i], i, obj[i]) === false) break;
    } else for (i in obj) if (callback.call(obj[i], i, obj[i]) === false) break;
    return obj;
}

Coloquei no GitHub para referência futura.

O callback.call é que faz a chamada à sua função. Os parâmetros desta função são:

  • thisArg - que é o elemento
  • arg1 e arg2 - que é o índice e novamente o elemento

O arg1 é que realmente será passado como argumento para a sua função anônima. No caso ele é expressado pela variável i no laço.

Se a sua função declarar os parâmetros como (i, e) você poderá receber o índice e o elemento sendo analisado naquela iteração. Em algumas situações basta receber o índice, em outras também precisa conhecer o elemento exato.

Um adendo final: quase sempre um loop comum resolve tão bem ou melhor que o uso da função each().

0
4

Vamos desmontar a chamada de função:

$(".fotos").each(function(e) {
  • $(".fotos") é um seletor do jQuery. O alvo pode ser um membro apenas, ou uma coleção;
  • .each é um método que permite uma chamada de função para todos os membros da coleção retornados pelo seletor;
  • function(e) é a função chamada pelo método each. O parâmetro e, neste caso, referencia o índice do elemento selecionado.

Portanto, se o seu seletor retornar uma coleção contento 3 elementos, a função será chamada 3 vezes, sendo o valor de e o valor do índice.

O nome e é arbitrário. Poderia ser qualquer nome válido, contanto que o código que o consome fizesse a referência correta:

$(".fotos").each(function(parm1){
            if(parm1 <= parm1 + 2){
                teste[posicao][parm1] = parm1;
5
  • Mal posso ver seus movimentos :P
    – Jéf Bueno
    Commented 25/09/2015 às 14:16
  • @JéfersonBueno não contavam com minha astúcia.
    – OnoSendai
    Commented 25/09/2015 às 14:17
  • O que eu queria entender, é o que exatamente é atribuido ao "e". Nesse caso um número inteiro já que há uma comparação? Mas como um número inteiro? De onde ele veio? O exemplo foi só ilustrativo, como eu disse... Commented 25/09/2015 às 14:20
  • 1
    @Sergio você está completamente correto. Eu estava com o .forEach do angular em mente. Muito Obrigado pela correção.
    – OnoSendai
    Commented 25/09/2015 às 14:25
  • @ErickLemos exatamente. Neste caso, e recebe um valor inteiro, gerado pelo método .each.
    – OnoSendai
    Commented 25/09/2015 às 14:28

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 .