Solucionado: Criando um array fizzbuzz

👋 Opa, Gabriel e Pedro aqui e seja bem-vindo para mais um episódio da nossa newsletter semanal, a Challenge House.

Toda quinta-feira, temos a solução de um desafio JavaScript que foi divulgado no início da semana.Vem com a gente que lá vem história...

🏠 Challenge House sendo desvendada

No início da semana, compartilhamos o Desafio JS: Criando um array fizzbuzz.

Sem mais demora, a solução em formato de código é essa aqui:

🌀 Ao vivo e à cores

Não acredita que o código ali em cima funciona? Criamos uma execução dele no CodePen para você poder ver de perto. Basta rodar 👇

🤓 Por que na minha máquina funciona?

Não adianta viver de CTRL + C e CTRL + Z. É preciso entender o motivo daquele código rodar da forma correta. Vamos lá?

O nosso código começa com a criação de uma função que aceita um parâmetro N. Esse parâmetro é uma variável que guarda o valor máximo da nossa iteração.

Logo após, dentro da nossa função criamos o nosso array. Que será o responsável por guardar cada valor da nossa iteração. Aqui há um detalhe interessante. Estamos declarando o nosso array como uma constante. Mas como isso funciona se iremos mudar o valor do array na nossa iteração ? Isso acontece, pois quando criamos um array estamos criando uma referência na memória para guardar os valores que serão armazenados. É essa referência que é uma constante os valores dentro do array podem mudar sem problemas.

Por fim, começamos nossa iteração com um simples loop for. Lembrando que o loop for funciona da seguinte forma:

O primeiro parâmetro irá ser a variável de controle, ou seja inicializamos uma variável que será a responsável por controlar o loop. Nesse caso podemos dizer que ela é o índex da nossa iteração. Logo após o segundo parâmetro irá tratar a condição de controle, ou seja, irá pegar a variável que pegamos no argumento anterior e irá em todo loop confirmar se a condição foi atingida e se sim impedirá que o loop rode novamente. O último argumento do nosso loop for será o incrementador, esse responsável por a cada loop modificar a nossa variável de controle para outro valor. Assim teremos uma interação de 1 a n. Como o desejado.

Dentro da nossa interação temos a verificação se os números são divisíveis por 3, 5 e 15. Verificamos a divisibilidade por 15 porque um número é divisível por 3 e 5 ao mesmo tempo quando ele é divisível por 15. Para fazer essa verificação nosso conjunto de ifs testa o resultado da operação usando o operador de divisão %. A porcentagem como operador divide e o resultado é na verdade o resto da divisão. Se uma divisão não tem resto isso significa que um número é divisível por outro.

Então, verificando as condições usamos a High Order Function push. Que “empurra” um valor para o array, o completando a cada interação com o valor devido.

É interessante notar que essa é uma Pure Function. Ou seja uma função que recebe um valor e toda vez que o mesmo valor for imputado o resultado da função será o mesmo, sem causar mudanças externas a função. Esse conceito de Pure Function é um conceito importante pois manter suas funções puras é uma forma de manter seu código mais limpo e performático!

Se você pensou de outra maneira e fez o um código diferente, iríamos adorar saber a solução também. Sinta-se a vontade para chamar a gente no instagram da Challenge House ou responder por email esta newsletter.

  1. ❤️ Compartilhar com os amigos - é com a sua ajuda que iremos levar o Challenge House para cada vez mais pessoas.

  2. ✉️ Se inscrever na nossa newsletter - se ainda não é, iremos ficar muito felizes com a sua inscrição.

Até segunda-feira,

Gabriel e Pedro 👋