Métodos de Array - Reduce
Published: 2021-04-22 23:44:48

Chegamos a mais um post da minha [saga de estudos](https://dev.to/inando85/bem-vindo-de-novo-javascript-1b48) em JavaScript.

No último post eu falei sobre o [método filter](https://dev.to/inando85/metodos-de-array-filter-3bm8)

No post de hoje irei falar um pouco sobre o método de array `reduce`.

### Método Reduce

`Reduce` recebe uma função como argumento e executa esta função para cada item do array.

Este método é utilizado quando baseado no array original, nós precisaremos reduzir o array a um tipo de dado.

Podemos reduzir um array em um objeto literal, uma string, um número ou até mesmo um novo array.

Então, é importante entender que o reduce tem poder e versatilidade para gerar um output  que não seja necessariamente um array.

Vamos começar com o exemplo mais simples para entender o `reduce`.

O reduce pode receber dois argumentos:

- 1: A função que será executada
- 2: O valor inicial do acumulador (accumulator)

A função recebida, recebe 4 parâmetros, sendo 2 obrigatórios e 2 opcionais.

Obrigatórios:

- 1: Accumulator, que é o acumulador, que receberá os dados.
- 2: Item, que é o item que está sendo iterado.

Opcionais:

- 1: Index, que é o índice do item que está sendo iterado
- 2: Array, que é o próprio array original.

Temos um array de números e queremos obter a soma de todos esses números, fazendo com que esse array seja reduzido a um único número.

```js
const numbers = [1, 2, 3]
const sumResult = numbers.reduce((accumulator, item) => accumulator + item, 0)

console.log(sumResult) // 6
```

Agora vamos imaginar uma situação mais real, imagina que temos um array com várias pontuações de jogadores e queremos obter a soma de todos os pontos de um determinado jogador.

```js
const scores = [
  { name: 'Vinicius Costa', score: 337 },
  { name: 'Roger Melo', score: 43 },
  { name: 'Alfredo Braga', score: 234 },
  { name: 'Pedro H. Silva', score: 261 },
  { name: 'Ana Paula Rocha', score: 491 },
  { name: 'Vinicius Costa', score: 167 },
  { name: 'Roger Melo', score: 137 },
  { name: 'Alfredo Braga', score: 135 },
  { name: 'Ana Paula Rocha', score: 359 },
  { name: 'Pedro H. Silva', score: 133 }
]

const alfredoScore = scores.reduce((accumulator, score) => {
  if (scores.name === 'Alfredo Braga') {
    accumulator += scores.score
  }
  return accumulator
}, 0)

console.log(alfredoScore) // 369
```

Agora vamos obter um output diferente, vamos obter uma string.

```js
const cart = [
  { name: 'Dark Souls III', price: 95.03 },
  { name: 'Shadow of the Tomb Raider', price: 101.19 },
  { name: 'Sekiro: Shadows Die Twice', price: 179.99 },
  { name: 'Resident Evil 2', price: 119.90 },
  { name: 'Death Stranding', price: 149.99 }
]

const games = cart.reduce((accumulator, game) => {
  accumulator += `- ${game.name}\n`
  return accumulator
}, '')

console.log(games)

/*
- Dark Souls III
- Shadow of the Tomb Raider
- Sekiro: Shadows Die Twice
- Resident Evil 2
- Death Stranding
*/
```

Ficamos por aqui com mais um conteúdo dos meus estudos, vou deixar o link da documentação do site da MDN sobre o [método reduce](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce).

________________________________________________________________

Esse foi mais um post da minha saga de estudos em JavaScript Vanilla. Espero que estejam gostando!

Qualquer dúvida ou sugestão, vocês me encontram nas minhas redes sociais:

[LinkedIn](https://linkedin.com/in/inando85)
[GIthub](https://github.com/inando85)