8

Eu tenho o seguinte código que funciona exatamente como esperado (que é percorrer o array, mostrando SÓ cada elemento, neste caso "Miguel" e "Celeste"):

var runners = ['Miguel', 'Celeste'];
Array.prototype.winner = function() {
  for (var i = 0; i < this.length; i++) {
    console.log(runners[i]);
  }
}
runners.winner();

A minha dúvida é porque é que este não? Porque é que faz sempre aquele ultimo loop e imprime a própria função? Será que existe alguma propriedade implícita que não entra para a contagem (this.length)? Se sim, então não existe maneira de fazer isto com for(var i in this) { certo?

var runners = ['Miguel', 'Celeste'];
Array.prototype.winner = function() {
    for(var i in this) {
    	console.log(runners[i]);
    }
}
runners.winner();

0

3 Respostas 3

8

O problema aqui é que o for...in é um método para Objetos, e vai buscar propriedades enumeráveis do mesmo, ou seja: as próprias e as definidas no prototype. Uma vez que estás a usar um método de objetos numa array, a função é passada também como uma propriedade do objeto. Contudo não é uma propriedade da instância mas sim do seu prototype, então é possivel filtrar essas propriedades "não próprias" com o .hasOwnProperty.

Repara aqui:

var runners = ['Miguel', 'Celeste'];
Array.prototype.winner = function() {
    for(var i in this) {
		console.log(i, this.hasOwnProperty(i));
    }
}

runners.winner();

Porém, o for ... in não é um método de arrays, mas há um recente que é. Usando o for ... of tudo fica certo, partindo do principio que o browser é moderno:

var runners = ['Miguel', 'Celeste'];
Array.prototype.winner = function() {
  for (var nome of this) {
    console.log(nome);
  }
}
runners.winner();

3
  • 1
    Até me sinto mal por fazer isto, peço imensa desculpa ao bigown que também explicou bem e já tinha aceite a sua resposta. Mas realmente esclareces melhor e inclusive dás um workaround para usar for(var x in... na mesma (apesar de eu agora saber que neste contexto nao faria sentido). Obgado
    – Miguel
    Commented 15/12/2016 às 23:32
  • @Miguel sim, o for..of respeita a ordem da lista/array, e é uma versão curta para arrays como o for..in é para Objectos. O for..in não garante contudo que as propriedades de um objeto sejam iteradas na mesma ordem em browsers diferentes. Mas for..of respeita a ordem.
    – Sergio
    Commented 16/12/2016 às 14:07
  • 1
    Percebido, obgado Sergio
    – Miguel
    Commented 16/12/2016 às 14:26
4

O terceiro índice do teu array é o próprio winner, ou seja, há o índice 0, o 1 e o winner (que é um índice também).

E como foi dito por @Maniero, o for in varre, além dos índices com o conteúdo que vc criou, os prototypes do objeto.

1
  • Percebi, Obgado Diego
    – Miguel
    Commented 15/12/2016 às 21:09
4

O primeiro, um for tradicional, varre o array. Ele acessa apenas os elementos do objeto do tipo Array, mas não as propriedades deles. Ele é semelhante ao novo for...of.

Já o for...in varre todas as propriedades do objeto, não só seus elementos (por isso quase sempre não é o que deseja, pelo menos para array).

Tem uma pergunta com informações mais detalhadas sobre o for.

Note que ambos estão varrendo o this que se refere ao próprio objeto. Mas que objeto estamos falando nesse código solto? É o DOM global do script. Então todos os símbolos do script estão contidos nesse objeto global implicitamente criado. Por isso a função faz parte desse objeto.

Pergunta com explicação sobre o this.

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 .