Files
freeCodeCamp/curriculum/challenges/italian/03-front-end-development-libraries/front-end-development-libraries-projects/build-a-javascript-calculator.md
Shaun Hamilton c2a11ad00d feat: add 'back/front end' in curriculum (#42596)
* chore: rename APIs and Microservices to include "Backend" (#42515)

* fix typo

* fix typo

* undo change

* Corrected grammar mistake

Corrected a grammar mistake by removing a comma.

* change APIs and Microservices cert title

* update title

* Change APIs and Microservices certi title

* Update translations.json

* update title

* feat(curriculum): rename apis and microservices cert

* rename folder structure

* rename certificate

* rename learn Markdown

* apis-and-microservices -> back-end-development-and-apis

* update backend meta

* update i18n langs and cypress test

Co-authored-by: Shaun Hamilton <shauhami020@gmail.com>

* fix: add development to front-end libraries (#42512)

* fix: added-the-word-Development-to-front-end-libraries

* fix/added-the-word-Development-to-front-end-libraries

* fix/added-word-development-to-front-end-libraries-in-other-related-files

* fix/added-the-word-Development-to-front-end-and-all-related-files

* fix/removed-typos-from-last-commit-in-index.md

* fix/reverted-changes-that-i-made-to-dependecies

* fix/removed xvfg

* fix/reverted changes that i made to package.json

* remove unwanted changes

* front-end-development-libraries changes

* rename backend certSlug and README

* update i18n folder names and keys

* test: add legacy path redirect tests

This uses serve.json from the client-config repo, since we currently use
that in production

* fix: create public dir before moving serve.json

* fix: add missing script

* refactor: collect redirect tests

* test: convert to cy.location for stricter tests

* rename certificate folder to 00-certificates

* change crowdin config to recognise new certificates location

* allow translations to be used

Co-authored-by: Nicholas Carrigan (he/him) <nhcarrigan@gmail.com>

* add forwards slashes to path redirects

* fix cypress path tests again

* plese cypress

* fix: test different challenge

Okay so I literally have no idea why this one particular challenge
fails in Cypress Firefox ONLY. Tom and I paired and spun a full build
instance and confirmed in Firefox the page loads and redirects as
expected. Changing to another bootstrap challenge passes Cypress firefox
locally. Absolutely boggled by this.

AAAAAAAAAAAAAAA

* fix: separate the test

Okay apparently the test does not work unless we separate it into
a different `it` statement.

>:( >:( >:( >:(

Co-authored-by: Sujal Gupta <55016909+heysujal@users.noreply.github.com>
Co-authored-by: Noor Fakhry <65724923+NoorFakhry@users.noreply.github.com>
Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>
Co-authored-by: Nicholas Carrigan (he/him) <nhcarrigan@gmail.com>
2021-08-13 21:57:13 -05:00

5.2 KiB

id, title, challengeType, forumTopicId, dashedName
id title challengeType forumTopicId dashedName
bd7158d8c442eddfaeb5bd17 Costruisci una Calcolatrice JavaScript 3 301371 build-a-javascript-calculator

--description--

Obiettivo: Costruisci un'app CodePen.io funzionalmente simile a questa: https://codepen.io/freeCodeCamp/full/wgGVVX.

Compila le user stories qui sotto e fai passare tutti i test. Dalle il tuo stile personale.

Puoi utilizzare qualsiasi mix di HTML, JavaScript, CSS, Bootstrap, SASS, React, Redux e jQuery per completare questo progetto. Dovresti usare un framework frontend (come React per esempio) perché questa sezione riguarda l'apprendimento dei framework per il frontend. Ulteriori tecnologie non elencate sopra non sono raccomandate e usarle è a tuo rischio. Stiamo cercando di supportare altri framework per il frontend come Angular e Vue, ma attualmente non sono supportati. Accetteremo e cercheremo di risolvere tutte le segnalazioni di problemi che utilizzano lo stack tecnologico suggerito per questo progetto. Happy coding!

User Story #1: La mia calcolatrice dovrebbe contenere un elemento cliccabile contenente un = (segno uguale) con un corrispondente id="equals".

User Story #2: La mia calcolatrice dovrebbe contenere 10 elementi cliccabili contenenti ciascuno un numero da 0-9, con i seguenti ID corrispondenti: id="zero", id="one", id="two", id="three", id="four", id="five", id="six" id="seven", id="eight" e id="nine".

User Story #3: La mia calcolatrice dovrebbe contenere 4 elementi cliccabili contenenti ognuno uno degli operatori matematici primari con i seguenti ID corrispondenti: id="add", id="subtract", id="multiply", id="divide".

User Story #4: La mia calcolatrice dovrebbe contenere un elemento cliccabile contenente un simbolo . (punto decimale) con un corrispondente id="decimal".

User Story #5: La mia calcolatrice dovrebbe contenere un elemento cliccabile con un id="clear".

User Story #6: La mia calcolatrice dovrebbe contenere un elemento per visualizzare i valori con un corrispondente id="display".

User Story #7: In qualsiasi momento, premendo il pulsante clear dovrebbero essere cancellati i valori di input e output, e la calcolatrice dovrebbe tornare suo stato iniziale; nell'elemento con l'id display dovrebbe essere mostrato 0.

User Story #8: Quando inserisco dei numeri, dovrei essere in grado di vedere il mio input nell'elemento con l'id display.

User Story #9: Dovrei essere in grado di aggiungere, sottrarre, moltiplicare e dividere una catena di numeri di qualsiasi lunghezza e in qualsiasi ordine, e quando premo =, il risultato corretto dovrebbe essere mostrato nell'elemento con l'id display.

User Story #10: La mia calcolatrice non dovrebbe consentire a un numero di iniziare con zeri multipli.

User Story #11: Quando l'elemento decimale viene cliccato, un . dovrebbe essere accodato al valore attualmente visualizzato; non dovrebbero essere accettati due . in un numero.

User Story #12: Dovrei essere in grado di eseguire qualsiasi operazione (+, -, *, /) sui numeri contenenti punti decimali.

User Story #13: Se 2 o più operatori sono inseriti consecutivamente, l'operazione effettuata dovrebbe essere l'ultimo operatore inserito (escluso il segno meno (-). Ad esempio, se viene inserito 5 + * 7 =, il risultato dovrebbe essere 35 (cioè 5 * 7); se viene inserito 5 * - 5 =, il risultato dovrebbe essere -25 (cioè 5 * (-5)).

User Story #14: Premere un operatore immediatamente dopo = dovrebbe avviare un nuovo calcolo che funzioni sul risultato dell'elaborazione precedente.

User Story #15: La mia calcolatrice dovrebbe avere diversi decimali di precisione quando si tratta di arrotondamento (nota che non c'è uno standard esatto, ma si dovrebbe essere in grado di gestire calcoli come 2 / 7 con ragionevole precisione ad almeno 4 decimali).

Nota sulla logica della calcolatrice: Va notato che ci sono due principali scuole di pensiero sulla logica dell'input della calcolatrice: logica a esecuzione immediata e logica della formula. Il nostro esempio utilizza la logica della formula e osserva l'ordine di precedenza degli operatori, mentre l'esecuzione immediata non lo fa. Entrambe sono accettabili, ma nota che a seconda di quale sceglierai, la calcolatrice potrà produrre risultati diversi rispetto ai nostri per alcune equazioni (vedi l'esempio in basso). Finché la matematica può essere verificata da un altro calcolatore di produzione, non considerarlo un bug.

ESEMPIO: 3 + 5 x 6 - 2 / 4 =

  • Logica a esecuzione immediata: 11.5
  • Logica della formula: 32.5

Puoi costruire il tuo progetto usando questo modello CodePen e facendo clic su Save per creare il tuo pen. Oppure puoi usare questo link CDN per eseguire i test in qualsiasi ambiente tu voglia: https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js

Una volta fatto, invia l'URL del tuo progetto di lavoro con tutti i suoi test passati.

--solutions--

// solution required