,
31 tweets,
7 min read
Read on Twitter
Nesse TDD Challenge você aprenderá:
✅ O que é e como descobrir o fatorial de um número;
✅ Como escrever testes para implementações que ainda não existem;
✅ Como fazer os testes passarem, escrevendo o mínimo de código possível.
Vem comigo! 👇
✅ O que é e como descobrir o fatorial de um número;
✅ Como escrever testes para implementações que ainda não existem;
✅ Como fazer os testes passarem, escrevendo o mínimo de código possível.
Vem comigo! 👇
Nesse post, seguiremos os 3 ciclos fundamentais do TDD, passo-a-passo, para codarmos uma função que retornará o fatorial de um número =D
Se você quiser me acompanhar, o boilerplate inicial é o tdd-playground, que terminei de configurar em posts passados.
Se você quiser me acompanhar, o boilerplate inicial é o tdd-playground, que terminei de configurar em posts passados.
À partir da master, criaremos uma nova branch '02-factorial' e, dentro da pasta src, um diretório '02-factorial' com os arquivos factorial.js e factorial.test.js.
Após executarmos `yarn test:watch`, escreveremos um teste para a função `getFactorial` (que ainda não existe).
Nesse primeiro teste, nos certificaremos que ela é uma função, através do método `toBeInstanceOf` do Jest.
Nesse primeiro teste, nos certificaremos que ela é uma função, através do método `toBeInstanceOf` do Jest.
A invocação desse método recebe o constructor do objeto que queremos testar:
Nosso primeiro teste retornou "ReferenceError: getFactorial is not defined".
O que faz sentido, pois ainda não declaramos a função.
🎉 1ª etapa desse ciclo cumprida com sucesso: criamos um teste que falha e o 👉vimos👈 falhar.
O que faz sentido, pois ainda não declaramos a função.
🎉 1ª etapa desse ciclo cumprida com sucesso: criamos um teste que falha e o 👉vimos👈 falhar.
Qual é o mínimo de código que podemos escrever para que este teste passe?
No arquivo 'factorial.js', vamos apenas declarar a função e exportá-la.
E dentro do arquivo 'factorial.test.js', podemos importar a função 'getFactorial':
No arquivo 'factorial.js', vamos apenas declarar a função e exportá-la.
E dentro do arquivo 'factorial.test.js', podemos importar a função 'getFactorial':
🎉 2ª etapa desse ciclo cumprida com sucesso: fizemos o teste passar, escrevendo o mínimo de código possível.
A 3ª etapa, Refactoring, ainda não faz sentido até aqui. Escrevemos muito pouco código para pensar em refatorar agora.
A 3ª etapa, Refactoring, ainda não faz sentido até aqui. Escrevemos muito pouco código para pensar em refatorar agora.
Iniciando o próximo ciclo de testes 👇
O plano é que essa função receba um número por parâmetro e, dentro dela, faça algum processo que retorne o fatorial desse número.
O plano é que essa função receba um número por parâmetro e, dentro dela, faça algum processo que retorne o fatorial desse número.
O que é o fatorial de um número❓
O fatorial é um número natural inteiro positivo que representa a multiplicação de um certo número por todos os seus antecessores, até chegar ao número 1.
O fatorial de 4 por exemplo, é 24. Por que:
O fatorial é um número natural inteiro positivo que representa a multiplicação de um certo número por todos os seus antecessores, até chegar ao número 1.
O fatorial de 4 por exemplo, é 24. Por que:
Já o fatorial de 5 é 120:
Pegou a ideia?
Então vamos escrever um 2º teste para checar se quando a função `getFactorial` é invocada, recebendo o número 3 por argumento, 👉6👈 é retornado.
Então vamos escrever um 2º teste para checar se quando a função `getFactorial` é invocada, recebendo o número 3 por argumento, 👉6👈 é retornado.
À partir de agora, vamos escrever e organizar nossas asserções adotando um mini-template, que indicará:
1⃣ Qual é o **output atual** da invocação da função e;
2⃣ Qual é o **output esperado** da invocação dela.
1⃣ Qual é o **output atual** da invocação da função e;
2⃣ Qual é o **output esperado** da invocação dela.
Por que o teste quebrou?
De acordo com o teste que escrevemos, o Jest esperava receber 6, mas recebeu `undefined`.
Isso faz sentido, afinal a função `getFactorial` não está retornando um valor.
De acordo com o teste que escrevemos, o Jest esperava receber 6, mas recebeu `undefined`.
Isso faz sentido, afinal a função `getFactorial` não está retornando um valor.
Ou seja, ✅ 1ª etapa desse ciclo cumprida com sucesso: criamos um teste que falha e o 👉vimos👈 falhar.
Qual é 👉o mínimo👈 de código que podemos escrever para que este teste passe?
Fazer com que a função retorne o valor que o teste espera:
Qual é 👉o mínimo👈 de código que podemos escrever para que este teste passe?
Fazer com que a função retorne o valor que o teste espera:
✅ 2ª etapa desse ciclo cumprida com sucesso: fizemos o teste passar, escrevendo o mínimo de código possível.
Até aqui, escrevemos um "dumb test" que apenas retorna o valor que especificamos como o esperado.
Vamos testar novamente a função, especificando outro valor de output.
Até aqui, escrevemos um "dumb test" que apenas retorna o valor que especificamos como o esperado.
Vamos testar novamente a função, especificando outro valor de output.
Escreveremos um 2º teste, checando se quando `getFactorial` é invocada, recebendo o número 4 por argumento, 👉24👈 é retornado:
Agora que vimos o teste falhar, chegou o momento de, com o mínimo de código possível, implementarmos 👉a lógica👈 para fazermos esse teste passar.
Afinal, não faz sentido implementarmos outro "dumb test", fazendo a função retornar 24, o teste anterior que escrevemos quebraria.
Afinal, não faz sentido implementarmos outro "dumb test", fazendo a função retornar 24, o teste anterior que escrevemos quebraria.
Existem algumas lógicas diferentes para resolvermos este problema.
Vou explicar para você, o passo a passo de como podemos implementar esse código utilizando primeiramente a forma típica, imperativa.
Vou explicar para você, o passo a passo de como podemos implementar esse código utilizando primeiramente a forma típica, imperativa.
No próximo post (parte 2), mostrarei como podemos refatorar esse código utilizando o paradigma Funcional =D
Primeiro, faremos com que a função `getFactorial` receba o parâmetro `num`, que é o número do qual queremos descobrir o fatorial.
E declararemos uma let `factorial`, iniciada com 1.
Usaremos essa let para descobrir qual é o fatorial do número passado por parâmetro.
E declararemos uma let `factorial`, iniciada com 1.
Usaremos essa let para descobrir qual é o fatorial do número passado por parâmetro.
Agora, vamos declarar um for loop. Esse loop irá cumprir o papel de decrementar o 2º número (fator) da multiplicação fatorial que deve acontecer.
Exemplo:
Exemplo:
Ou seja, podemos declarar a expressão de inicialização do loop com uma let recebendo o número do qual queremos descobrir o fatorial, que foi recebido por parâmetro:
Vamos também especificar que o loop será executado enquanto `i` for maior ou igual à 1.
E que à cada iteração, `i` deve ser decrementado:
E que à cada iteração, `i` deve ser decrementado:
Dentro desse loop, faremos apenas com que à cada iteração, a let `factorial` receba tudo o que ela já tem, multiplicado por `i`.
Ao fazermos isso e, depois do loop, retornarmos a let `factorial` e salvarmos o arquivo, os testes passam:
Ao fazermos isso e, depois do loop, retornarmos a let `factorial` e salvarmos o arquivo, os testes passam:
Vamos examinar de perto o que está acontecendo à cada iteração do for.
Observe o output desse console.log dentro do loop:
Observe o output desse console.log dentro do loop:
A sequência que o for loop executa no caso do fatorial do número 3, por exemplo, é a seguinte:
Lembre-se: no próximo post, vamos refatorar esse código utilizando a forma mais divertida e concisa de se programar, a Funcional 😍.
Acha que esse conteúdo pode ajudar + pessoas❓
👉Retweeta👈 essa thread!
Linkei o início dela ali
em baixo, para facilitar =)
Te vejo na próxima 🔥
👉Retweeta👈 essa thread!
Linkei o início dela ali
em baixo, para facilitar =)
Te vejo na próxima 🔥
