Thuta Learning
ProjectsProgrammingbeginner

Calculator App

Relax. We'll talk through this in plain words — no textbook voice.

🧮 Calculator App - Interactive calculator with basic operations, clear, and display. Perfect beginner project!

📚 Concepts Covered:

• DOM Manipulation

• Event Listeners

• String operations

• eval() function

• Error handling

✨ Features:

• Add, Subtract, Multiply, Divide

• Clear button

• Display result

• Handle errors

javascript
// Calculator App (Console version)

class Calculator {
    constructor() {
        this.display = "0";
        this.currentValue = "0";
        this.previousValue = null;
        this.operator = null;
    }
    
    inputNumber(num) {
        if (this.display === "0") {
            this.display = String(num);
        } else {
            this.display += String(num);
        }
        return this.display;
    }
    
    inputOperator(op) {
        this.previousValue = parseFloat(this.display);
        this.operator = op;
        this.display = "0";
        return `Operator: ${op}`;
    }
    
    calculate() {
        const current = parseFloat(this.display);
        const previous = this.previousValue;
        let result = 0;
        
        switch(this.operator) {
            case '+': result = previous + current; break;
            case '-': result = previous - current; break;
            case '*': result = previous * current; break;
            case '/': 
                if (current === 0) return "Error: Division by zero";
                result = previous / current;
                break;
            default: return this.display;
        }
        
        this.display = String(result);
        this.operator = null;
        this.previousValue = null;
        return result;
    }
    
    clear() {
        this.display = "0";
        this.currentValue = "0";
        this.previousValue = null;
        this.operator = null;
        return "Cleared";
    }
}

// Demo usage
const calc = new Calculator();
console.log("Input: 10"); calc.inputNumber(10);
console.log("Operator: +"); calc.inputOperator('+');
console.log("Input: 5"); calc.inputNumber(5);
console.log(`Result: ${calc.calculate()}`);
console.log(calc.clear());
You should see
Input: 10 Operator: + Input: 5 Result: 15 Cleared
Calculator App | Thuta Learning