5.4 KiB
| id | title | challengeType | forumTopicId | dashedName |
|---|---|---|---|---|
| bd7158d8c442eddfaeb5bd17 | Criar uma calculadora JavaScript | 3 | 301371 | build-a-javascript-calculator |
--description--
Objetivo: criar uma aplicação no CodePen.io que tenha função semelhante a esta: https://codepen.io/freeCodeCamp/full/wgGVVX.
Atenda às especificações de usuário abaixo e obtenha aprovação em todos os testes. Dê a ele o seu próprio estilo pessoal.
Você pode usar qualquer mistura de HTML, JavaScript, CSS, Bootstrap, SASS, React, Redux e JQuery para completar este projeto. Você deve usar um framework de front-end (como React por exemplo) porque essa seção trata de aprender frameworks de front-end. Tecnologias adicionais não listadas acima não são recomendadas e usá-las é por sua conta e risco. Estamos buscando apoiar outros frameworks de front-end, como Angular e Vue, mas eles não são atualmente suportados. Vamos aceitar e tentar corrigir todos os relatórios de problemas que usem o conjunto de tecnologias sugeridas para esse projeto. Boa programação!
Especificação de usuário nº 1: minha calculadora deve conter um elemento clicável contendo um = (sinal de igualdade) com o id="equals" correspondente.
Especificação de usuário nº 2: minha calculadora deve conter 10 elementos clicáveis contendo um número cada, de 0 até 9, com os ids correspondentes a seguir: id="zero", id="one", id="two", id="three", id="four", id="five", id="six", id="seven", id="eight" e id="nine".
Especificação de usuário nº 3: minha calculadora deve conter 4 elementos clicáveis, cada um contendo uma das 4 operações matemáticas primárias com os ids correspondentes a seguir: id="add", id="subtract", id="multiply", id="divide".
Especificação de usuário nº 4: minha calculadora deve conter um elemento clicável contendo o símbolo . (ponto decimal) com o id="decimal" correspondente.
Especificação de usuário nº 5: minha calculadora deve conter um elemento clicável com um id="clear".
Especificação de usuário nº 6: minha calculadora deve conter um elemento para exibir valores com o id="display" correspondente.
Especificação de usuário nº 7: a qualquer momento, pressionar o botão clear limpará os valores de entrada e saída, e retornará a calculadora ao seu estado inicial. "0" deve ser mostrado no elemento com o id display.
Especificação de usuário nº 8: enquanto eu coloco números de entrada, eu devo ser capaz de ver a minha entrada no elemento com id display.
Especificação de usuário nº 9: em qualquer ordem, eu devo ser capaz de adicionar, subtrair, multiplicar e dividir uma cadeia de números de qualquer tamanho, e quando eu pressionar =, o resultado correto deve ser mostrado no elemento com id display.
Especificação de usuário nº 10: ao inserir números, minha calculadora não deve permitir um número de começar com múltiplos zeros.
Especificação de usuário nº 11: quando o elemento decimal for clicado, um . deve ser adicionado ao valor atualmente exibido. Dois . em um número não devem ser aceitos.
Especificação de usuário nº 12: eu devo ser capaz de executar qualquer operação (+, -, *, /) em números contendo pontos decimais.
Especificação de usuário nº 13: Se 2 ou mais operadores forem inseridos consecutivamente, a operação executada deve ser o último operador inserido, excluindo o símbolo de negação (-). Por exemplo, se 5 + * 7 = for inserido, o resultado deve ser 35 (ou seja, 5 * 7); se 5 * - 5 = for inserido, o resultado deve ser -25 (ou seja, 5 * (-5)).
Especificação de usuário nº 14: pressionar um operador imediatamente após um = deve iniciar um novo cálculo que opera no resultado da avaliação anterior.
Especificação de usuário nº 15: minha calculadora deve ter diversas casas decimais de precisão ao se tratar de arredondamento (note que não há um padrão exato, mas você deve ser capaz de lidar com cálculos como 2 / 7 com precisão razoável de pelo menos 4 casas decimais).
Nota para a lógica da calculadora: deve-se notar que há duas principais escolas de pensamento na lógica de entrada da calculadora: a lógica da execução imediata e a lógica da fórmula. Nosso exemplo utiliza a lógica da fórmula e observa a ordem de precedência de operação. A lógica de execução imediata não faz isso. Qualquer uma é aceitável, mas observe que, dependendo de qual você escolher, sua calculadora pode alcançar diferentes resultados do que os nossos para certas equações (veja abaixo um exemplo). Desde que sua matemática possa ser verificada por outra calculadora em produção, não considere isso um bug.
EXEMPLO: 3 + 5 x 6 - 2 / 4 =
- Lógica de execução imediata:
11.5 - Lógica de fórmula/expressão:
32.5
Você pode fazer o seu projeto usando este modelo da CodePen e clicando em Save para criar seu próprio pen. Como alternativa, use este link da nossa CDN para executar os testes em qualquer ambiente que você preferir: https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js
Quando tiver terminado, envie o URL do seu projeto depois de ele haver passado em todos os testes.
--solutions--
// solution required