Javascript Reduce em 5 minutos

Com certeza você sabe fazer um loop em uma collection, mas você sabe o que significa reduzir uma collection? Não!? Isso te soa estranho? Calma, é bem simples, tenho certeza que você já fez isso:

Pronto! Você reduziu a collection de numbers dentro de uma variável total. 😃

Vamos ver outro exemplo:

Agora você reduziu a collection words dentro da variável message.

Acho que você deve ter notado a semelhança entre os dois códigos. Iniciamos com uma collection (numbers, words) e uma variável (total, message) com um valor inicial (0, “”), depois iteramos na collection para alterar o valor da variável.

Tá mas é só isso? um for?

Vamos lá! Veja esse código:

Wow. Então o objeto Array já sabe reduzir? 😮

Exatamente! Sempre que você quiser iterar em uma collection a fim de criar um novo valor pergunte a si mesmo se você pode considerar o uso da função Array.prototype.reduce.

Sintaxe

O reduce recebe dois parâmetros:

1. callback: Uma função de callback (que explicarei logo em seguida).
2. initialValue (opcional): Um valor inicial para o retorno que pode ser qualquer dado. Se esse parâmetro não for informado, o valor inicial padrão é o primeiro item do array a ser iterado.

O reduce executa a função de callback uma vez para cada elemento presente no array, excluindo furos (valores indefinidos), recebendo quatro argumentos: o valor inicial (ou o valor do callback anterior, previousValue), o valor do elemento corrente (currentValue), o índice (index) corrente e o próprio array onde a iteração está ocorrendo. — MDN

Você pode reduzir a qualquer tipo de dado. Não apenas soma ou concatenação, exemplo:

Você também pode ler a Documentação do Reduce no MDN para ir mais afundo

Parabéns! Agora você sabe o que é e como usar o Reduce!

Ainda não conhece a Open School Brasil?

Comunidade totalmente open criada por desenvolvedores, mas com o objetivo de transmitir qualquer tipo de conhecimento para qualquer profissional, saiba o que é a Open School Brasil.