lume.books & ideiasPortfólio
JavaScript — Do zero à autonomia
Capítulo 06/48 · Projeto 01 — Simulador de orçamento
JavaScript — Do zero à autonomiaParte I — Pensar como o JavaScriptCapítulo 06 · Edição de estudo

Use os exemplos como laboratório: leia o código, preveja o resultado e teste no ambiente de prática. Para guardar uma ideia, selecione qualquer trecho.

CAPÍTULO 06 DE 48

Projeto 01 — Simulador de orçamento

Neste capítulo, você transforma regras de negócio pequenas em uma decisão de programação que pode ser explicada, testada e revisada. Você sairá com uma implementação pequena, evidências de teste e um critério reutilizável nos projetos seguintes.

Parte I — Pensar como o JavaScript6 questões comentadasConceito · laboratório · projeto

Escrita, marcações e comentários ficam só neste navegador, separados por capítulo e sem sincronização com a conta. Evite informações sensíveis; limpar os dados do navegador pode remover seus registros.

02

Prepare-se — O que você vai construir

  • Explicar regras de negócio pequenas sem depender de uma receita decorada.
  • Relacionar entrada validada ao contrato e ao fluxo observável.
  • Aplicar saída explicável em um caso real e em um limite.

Se precisar de apoio, consulte a capítulo anterior e volte a estas tarefas. Não há obrigação de seguir um prazo.

03

Entenda — Modelo mental e estrutura

1. Comece pelo modelo mental

O primeiro projeto combina valores, conversões e decisões sem interface. Cada cálculo deve ser uma função pequena e cada regra precisa ter um exemplo que demonstre limite e erro. Em regras de negócio pequenas, a sintaxe é apenas a superfície de um contrato. Relacione essa ideia a entrada validada e saída explicável antes de editar o exemplo. Em software real, uma linha pode compilar e ainda representar uma suposição incorreta sobre dados, tempo, ambiente ou responsabilidade. Por isso, descreva a entrada, a transformação e o resultado observável com palavras simples.

Descreva primeiro o contrato de regras de negócio pequenas e como ele se relaciona com entrada validada. Implemente a menor versão que revele o mecanismo e mantenha o caminho principal fácil de seguir. Se a solução depende de estado implícito, conversão silenciosa ou ordem acidental, registre essa dependência e procure torná-la explícita. O objetivo não é memorizar uma receita: é reconhecer quando o conceito se aplica, escolher uma abstração proporcional e conseguir explicar o custo dessa escolha.

2. Leia o código como uma sequência de decisões

function totalDoItem(preco, quantidade) {
  if (!Number.isFinite(preco) || quantidade < 1) throw new Error('Item inválido');
  return preco * quantidade;
}

Leia o exemplo de fora para dentro. Primeiro localize os dados e o contrato público; depois acompanhe as transformações; por fim, identifique efeitos, falhas e saídas. O trecho deixa regras de negócio pequenas visível no código e permite evoluir saída explicável sem esconder o fluxo principal. Digite o trecho em vez de apenas copiá-lo. Troque nomes e valores, faça uma hipótese e execute novamente. Essa comparação mostra o que pertence à regra da linguagem ou do framework e o que existe apenas por causa do exemplo.

Observe também o que o código não garante. JavaScript modela dados e comportamento; o DOM representa a interface; rede e armazenamento são fronteiras que podem falhar. Um tipo estático não valida automaticamente uma resposta externa; um componente não substitui semântica; uma abstração não corrige um contrato mal definido. Comentários úteis registram intenção, limite ou motivo. Comentários que repetem a sintaxe não compensam nomes vagos ou responsabilidades misturadas.

3. Converta observação em critério verificável

Uma solução forte torna regras de negócio pequenas legível, verifica entrada validada com evidência e registra os limites de saída explicável. Um bom critério descreve contexto, ação e resultado. Em vez de “funcionou”, registre qual entrada foi usada, qual saída era esperada e como uma falha deveria aparecer. Inspecione valores, mensagens e transições no console, navegador e testes automatizados. Quando houver interface, percorra também com teclado, zoom e tecnologia assistiva; quando houver servidor ou compilação, confira logs, tipos e limites de confiança.

A armadilha central é: misturar leitura, cálculo e exibição em um bloco global ou arredondar valores monetários em etapas inconsistentes.. Corrija a causa antes de empilhar exceções. Reduza o caso, reproduza o problema, altere uma variável por vez e repita o teste. Ao terminar, você deve conseguir dizer por que a solução funciona, quais suposições preserva, onde pode falhar e que evidência outra pessoa pode usar para revisar a entrega.

04

Analise — Código em contexto

Uma revisão começa pela intenção. Para “Projeto 01 — Simulador de orçamento”, o requisito é: a solução deve demonstrar regras de negócio pequenas, preservar entrada validada e reagir de forma previsível quando saída explicável variar. Analise a variação abaixo e preveja o resultado antes de executá-la.

const cenarios = [[10, 2], [0, 1], [12, -1]];
for (const cenario of cenarios) console.log(cenario);

A variação isola entrada validada. Acompanhe dados, controle e efeitos antes de decidir se o resultado respeita o contrato. Faça quatro passagens. Na primeira, identifique entradas e saídas. Na segunda, siga o fluxo de controle e as transformações. Na terceira, procure valores ausentes, concorrência, mutação e dependências do ambiente. Na quarta, avalie a experiência de erro e a capacidade de testar o trecho isoladamente.

Compare a variação com o exemplo principal. Escolha uma mudança e formule uma hipótese completa: “se eu alterar isto, espero aquilo, porque…”. Execute, observe e registre. A resposta importante não é apenas qual trecho passa no caso feliz, mas qual comunica melhor o contrato, reduz acoplamento e permanece compreensível para quem precisar manter, depurar ou integrar o módulo depois.

05

Construa — Teste cada decisão no ambiente

Crie um laboratório pequeno e executável em console, navegador e testes automatizados. Reproduza o exemplo, explique cada etapa e crie uma segunda versão que aplique saída explicável sem perder regras de negócio pequenas. Primeiro implemente o caminho principal sem abstrações prematuras. Depois use o depurador, o verificador de tipos, os testes ou as ferramentas de inspeção adequadas para confirmar o fluxo. Por último, force três situações adversas: entrada vazia, volume maior que o esperado e falha controlada em console, navegador e testes automatizados.

Não corrija todos os sintomas de uma vez. Para cada falha, anote hipótese, evidência e menor mudança. Rode novamente os cenários já aprovados para detectar regressões. Quando houver mais de uma solução possível, escolha pela clareza do contrato, pela facilidade de teste e pelo custo de mudança. Uma captura ou um log ajuda a documentar, mas código, critérios e testes reproduzíveis continuam sendo a fonte principal da entrega.

06

Pratique — Seis decisões de implementação

Resolva primeiro pelo raciocínio. Consultar o capítulo e testar hipóteses no navegador faz parte do processo; depois, releia as justificativas.

E1 — Aplicar em contexto

Qual decisão inicia corretamente o trabalho de “Projeto 01 — Simulador de orçamento”?

E2 — Aplicar em contexto

Qual verificação oferece a evidência mais forte para este capítulo?

E3 — Aplicar em contexto

Qual prática deve ser evitada nesta implementação?

E4 — Aplicar em contexto

Qual escolha protege melhor quem usa ou integra o recurso?

E5 — Aplicar em contexto

Ao investigar um resultado inesperado, qual sequência é mais confiável?

E6 — Aplicar em contexto

Quando a entrega pode ser considerada pronta para revisão?

07

Confira — Gabarito comentado

Abrir gabarito e explicações completas

E1 — A. A implementação começa pelo contrato observável. Descreva primeiro o contrato de regras de negócio pequenas e como ele se relaciona com entrada validada. Assim, a sintaxe passa a servir a uma decisão que pode ser revisada.

E2 — C. A evidência precisa exercitar o mecanismo estudado. Executar o caminho principal e os limites de entrada validada, observando o resultado de saída explicável. O caso feliz isolado não revela limites nem recuperação.

E3 — B. A armadilha é misturar leitura, cálculo e exibição em um bloco global ou arredondar valores monetários em etapas inconsistentes. Ela oculta o mecanismo e amplia o risco de regressão quando dados ou requisitos mudam.

E4 — A. A alternativa correta inclui pessoas e integrações no contrato: Manter nomes, estados, foco e mensagens compreensíveis quando regras de negócio pequenas chegar à interface. Estados e limites precisam permanecer compreensíveis.

E5 — C. A sequência baseada em evidência relaciona causa e efeito. Mudanças amplas escondem o mecanismo e dificultam perceber regressões.

E6 — B. Pronto para revisão significa atender critérios observáveis. O contrato de regras de negócio pequenas está explícito, entrada validada foi exercitado e a falha de saída explicável produz um estado compreensível. Outra pessoa ainda pode encontrar melhorias, mas consegue reproduzir a evidência.

08

Projete — Implemente, compare e refine

Entrega incremental: um simulador com itens, desconto, frete, validação, resumo textual e uma tabela manual de cenários. Comece descrevendo, em até cinco linhas, quem usa o recurso e qual tarefa precisa concluir. Separe domínio, entrada e apresentação conforme a escala do problema. Inclua um caso real, um limite e uma falha recuperável. Ao final, escreva uma nota técnica explicando onde aplicou regras de negócio pequenas, como verificou entrada validada e qual limite encontrou em saída explicável.

Consultar um modelo possível
function totalDoItem(preco, quantidade) {
  if (!Number.isFinite(preco) || quantidade < 1) throw new Error('Item inválido');
  return preco * quantidade;
}

O modelo ilustra uma possibilidade. Use os critérios para revisar suas próprias ideias, não para copiar as mesmas frases.

Critérios para revisar

  • O contrato de regras de negócio pequenas está explícito, entrada validada foi exercitado e a falha de saída explicável produz um estado compreensível.
  • Manter nomes, estados, foco e mensagens compreensíveis quando regras de negócio pequenas chegar à interface.
  • O código evidencia regras de negócio pequenas e entrada validada sem estado acidental.
  • A nota técnica registra o teste de entrada vazia, volume maior que o esperado e falha controlada em console, navegador e testes automatizados.

Até 12.000 caracteres em cada versão. Produção livre, sem correção automática.

09

Retome — Organize sua revisão

  • Explique com suas palavras a relação entre regras de negócio pequenas e entrada validada.
  • Reabra o laboratório sem consultar o texto e reconstrua a decisão ligada a saída explicável.
  • Aplique o teste “Executar o caminho principal e os limites de entrada validada, observando o resultado de saída explicável.” ao projeto acumulado e registre uma melhoria.

Feche a explicação, tente lembrar um exemplo e depois confira. Retome uma dificuldade no próximo encontro e alguns dias depois; ajuste o intervalo ao que ainda precisa praticar.

Use exemplos concretos na autoavaliação: “consigo explicar com consulta” ou “quero praticar novamente”. Marcar como lida não representa uma certificação.

SEU PROGRESSO NO CAPÍTULO 06

Um capítulo, no seu ritmo.

— exercícios respondidos

Carregando progresso…

Você decide quando marcar este capítulo como lido. Isso não altera seus exercícios nem suas marcações.

Acompanhar todos os capítulos →

Progresso salvo só neste navegador, sem sincronização com sua conta.

Guardar uma ideia

Cor e significado

Você pode personalizar os significados no seu caderno.

Salvo só neste navegador, sem sincronização com a conta. Evite informações sensíveis em computadores compartilhados.

Do seu jeito de ler

Encontre o ritmo mais confortável para seus olhos.

Ambiente
Tipografia
Tamanho do texto
Entrelinhas
Largura da leitura

Preferências salvas neste navegador. O progresso indica a posição na página, não o domínio do conteúdo.

Seções do Capítulo 06