Mohammad Taha
Menu
Email me
Public repoBuilt solo

macOS Calculator (Web)

Vanilla JS calculator

A pixel-faithful macOS dark-mode calculator in vanilla JavaScript and CSS Grid. It evaluates expressions without eval() — the display is split into tokens and reduced by precedence — and handles operator overwriting and sign-toggling edge cases.

Source on GitHub
The macOS-style dark calculator running in a browser.
Built with
JavaScriptHTML & CSS
Type
Personal project
Source
Public on GitHub

Limits and open work

  • Key presses are logged but not wired to the calculator yet. code

Decisions worth knowing

  • Precedence without eval()

    The display string is split into numbers and operators; × and ÷ are reduced first, then + and − left to right.

    code

  • Last operator wins

    Typing an operator right after another replaces it, so 5+× becomes 5×.

    code

A closer look

  1. display2+3×4
  2. split[2, +, 3, ×, 4]
  3. × ÷ pass[2, +, 12]
  4. + − pass14
Figure — precedence in two passescode The steps calculateResult() takes for one input.