NodeJS / Javascript - Como utilizar o método .reduce() para contar itens de uma array


.reduce() é um método pouco explorado pela maior parte dos desenvolvedores que geralmente preferem trabalhar com for/whiles.

A utilização do método .reduce() torna o código mais elegante e profissional porém para isso precisamos fazer uma pequena investigação de como ele funciona para depois disso, utilizando o conhecimento adquirido, criar nosso método de contagem de itens.

Sua estrutura básica segue o padrão:

 array.reduce(callback, [initialValue])

Onde callback é uma função de retorno e initialValue é o valor inicial recebido pelo método.

Para isso vamos trabalhar com a Array simples indicada abaixo:

 words = ['abacaxi','banana','maçã','abacaxi','pera','banana','uva','laranja']  

Vamos agora investigar como .reduce() trata a Array através do código abaixo:

 words.reduce(function( object , item ){  
   console.log( object , item );  
 },{})  


.reduce() interage em cada elemento da Array listando seus itens (banana, maçã, etc.) porém ele só printa um objeto (vazio) na primeira iteração. Nas demais ele retorna undefined.

O objeto da primeira iteração na verdade é o objeto enviado em initialValue. Como enviamos um objeto vazio ele vai imprimir este objeto vazio. Ele não imprime nada nas demais iterações pois nós não retornamos nada para a função de callback.

Vamos ver como o método .reduce() se comporta colocando um retorno para a função callback:

 words.reduce(function( object , item ){  
   console.log( object , item );
   return object;  
 },{})  



Ele retorna o objeto vazio inicial em cada uma das iterações, isso porque na verdade nós não modificamos o objeto original, apenas retornamos ele da mesma forma que veio inicialmente.

Agora vamos modificar este objeto e ver o que acontece. O que faremos é acrescentar um índice ao objeto que será o valor de cada um dos elementos em cada iteração:

 words.reduce(function( object , item ){  
   console.log( object , item ); 
   if ( !object[item] ) {
      object[item]=1;
   }
   return object; 
 },{})  



Ele criou uma propriedade para cada item da iteração no objeto e colocou um 1 como valor. Perceba que mesmo quando um item é repetido ele continua com o valor 1. Isso porque nosso código apenas atribui o número 1 para propriedades que são criadas naquele momento ( !object[item] ). Quando a propriedade já existe ele simplesmente ignora e retorna o objeto com estava na iteração anterior.

Para que a cada iteração possamos somar o item aos que já existem a fim de contar quantos itens existem na Array vamos modificar novamente nosso código:
 words.reduce(function( object , item ){  
   console.log( object , item ); 
   if ( !object[item] ) {
      object[item]=1;
   } else {
      object[item]++;
   }
   return object; 
 },{})  




Nosso código melhorou bastante!

Agora ele, ou cria a propriedade quando não existe, ou incrementa o valor em +1 quando itera como a Array e o item aparece novamente.

Desta forma conseguimos contar os elementos.

Para finalizar vamos retirar o console.log() a fim de limpar nosso código e entregá-lo finalizado:
 words.reduce(function( object , item ){  
   console.log( object , item ); 
   if ( !object[item] ) {
      object[item]=1;
   } else {
      object[item]++;
   }
   return object; 
 },{})  




E é isso, o .reduce() utilizado para realizar a contagem de itens em uma Array.



Comentários

Postagens mais visitadas deste blog

PHP - Utilizando proxy e CURL para acessar servidores ou sites

MySQL - Cálculo de período de tempo entre duas datas com TIMESTAMPDIFF

PHP - Gerando arquivo em UTF-8 com fwrite() e utf8_encode()