Penso che il codice sia ora più "dignitoso" anche se ridondante.
Sì, penso anche io. Direi che hai fatto sicuramente dei passi in avanti.

Il prossimo potrebbe essere quello di cercare il più possibile di scindere le varie componenti dell'applicazione così da poter poi ottenere quelle caratteristiche apprezzabili, ad esempio, in un'applicazione di qualità. E' chiaro che la cosa va commisurata al contesto (che in questo caso potremmo definire "didattico"), ma sicuramente può essere utile comprendere l'importanza di impostare lo sviluppo secondo certi criteri.
Non sto qui ad elencare le varie qualità di una buona applicazione, e sufficiente wiki: https://it.wikipedia.org/wiki/Qualit%C3%A0_del_software

Analizzando il tuo elaborato si nota una mescolanza eterogenea delle varie tecnologie. In generale, proprio questo tipo di approccio, rende difficile l'implementazione stessa dell'applicazione.

Una buona pratica (parlando dello sviluppo web) è quella di tenere ben distinte le 3 tecnologie che compongono una pagina web.
Parliamo dunque di HTML, CSS e JavaScript che definiscono rispettivamente "struttura", "presentazione" e "azione".

Per poter sviluppare del codice facilmente implementabile è utile, se non indispensabile, definire meglio i confini tra queste componenti.

Ora, la tua applicazione ad esempio non è molto affidabile nei risultati che può restituire, perché manca un controllo dei dati inseriti.
Tu dirai "sì, ancora non l'ho sviluppato ma magari lo aggiungerò in seguito". Lasciami dire però che, per come hai impostato il JavaScript (cioè tutto sta dentro gli eventi onclick dei singoli tasti) ti sarà impossibile effettuare questo tipo di migliorie senza aggrovigliare maggiormente il tutto.

La buona regola è "mantenere l'azione (JavaScript) separata dalla struttura (HTML)".

Ancora, ho visto che hai iniziato ad impostare un tag <style> per definire il CSS, e questo è un punto a tuo favore; ora però io ci metterei anche quel ridondante 'width:50px' che hai appiccicato su ogni singolo input. Sicuramente ti serviranno 2 o 3 righe di CSS da definire nel tag <style>, anziché una caterva di singoli attributi style sparsi per tutto l'HTML.

La buona regola, anche in questo caso, è "mantenere la presentazione (CSS) separata dalla struttura (HTML)".

Queste sono le due principali regole per una buona programmazione web.

Nel frattempo ho provato anche io a mettere giù qualcosa, come anticipato.
Purtroppo mi stava prendendo la mano è la cosa stava diventando sovradimensionata rispetto a quella che doveva essere una base di partenza, come ti avevo accennato. Ho dovuto quindi creare un versione ridimensionata per uso "didattico"

Io direi però che l'oggetto in discussione è stato risolto e ampiamente dibattuto, per cui aprirò una discussione dove postare l'elaborato come pillola. Si può proseguire lì per gli eventuali approfondimenti.


PS: nell'applicazione da me rielaborata c'è qualche differenza riguardo l'inserimento delle funzioni (sin, cos, ecc..). Io ho ideato una funzione a parte che racchiude in automatico l'intera espressione dentro la specifica funzione matematica relativa al tasto cliccato. Forse però questo limita l'utilizzo all'interno dell'espressione stessa... boh, magari sono migliorie da fare.
Inoltre non ho implementato tutte le funzioni matematiche che tu hai aggiunto qui nell'ultimo codice. Anche questa può essere una cosa da implementare.