Skip to content

Commit ee4022e

Browse files
nifaliananifaliana
committed
⚡️ Calculator > Logic implementation
1 parent 0ae5049 commit ee4022e

File tree

1 file changed

+136
-0
lines changed

1 file changed

+136
-0
lines changed

‎easy/calculator/app.js‎

Lines changed: 136 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,136 @@
1+
class Calculator {
2+
constructor(previousOperandTextElement, currentOperandTextElement) {
3+
this.previousOperandTextElement = previousOperandTextElement;
4+
this.currentOperandTextElement = currentOperandTextElement;
5+
this.clear();
6+
}
7+
8+
clear() {
9+
this.currentOperand = "";
10+
this.previousOperand = "";
11+
this.operation = undefined;
12+
}
13+
14+
delete() {
15+
this.currentOperand = this.currentOperand.toString().slice(0, -1);
16+
}
17+
18+
appendNumber(number) {
19+
if (number === "." && this.currentOperand.includes(".")) return;
20+
this.currentOperand = this.currentOperand.toString() + number.toString();
21+
}
22+
23+
chooseOperation(operation) {
24+
if (this.currentOperand === "") return;
25+
if (this.previousOperand !== "") {
26+
this.compute();
27+
}
28+
this.operation = operation;
29+
this.previousOperand = this.currentOperand;
30+
this.currentOperand = "";
31+
}
32+
33+
compute() {
34+
let computation;
35+
const prev = parseFloat(this.previousOperand);
36+
const current = parseFloat(this.currentOperand);
37+
if (isNaN(prev) || isNaN(current)) return;
38+
switch (this.operation) {
39+
case "+":
40+
computation = prev + current;
41+
break;
42+
case "-":
43+
computation = prev - current;
44+
break;
45+
case "*":
46+
computation = prev * current;
47+
break;
48+
case "÷":
49+
computation = prev / current;
50+
break;
51+
default:
52+
return;
53+
}
54+
this.currentOperand = computation;
55+
this.operation = undefined;
56+
this.previousOperand = "";
57+
}
58+
59+
getDisplayNumber(number) {
60+
const stringNumber = number.toString();
61+
const integerDigits = parseFloat(stringNumber.split(".")[0]);
62+
const decimalDigits = stringNumber.split(".")[1];
63+
let integerDisplay;
64+
if (isNaN(integerDigits)) {
65+
integerDisplay = "";
66+
} else {
67+
integerDisplay = integerDigits.toLocaleString("en", {
68+
maximumFractionDigits: 0,
69+
});
70+
}
71+
if (decimalDigits != null) {
72+
return `${integerDisplay}.${decimalDigits}`;
73+
} else {
74+
return integerDisplay;
75+
}
76+
}
77+
78+
updateDisplay() {
79+
this.currentOperandTextElement.innerText = this.getDisplayNumber(
80+
this.currentOperand
81+
);
82+
if (this.operation != null) {
83+
this.previousOperandTextElement.innerText = `${this.getDisplayNumber(
84+
this.previousOperand
85+
)} ${this.operation}`;
86+
} else {
87+
this.previousOperandTextElement.innerText = "";
88+
}
89+
}
90+
}
91+
92+
const numberButtons = document.querySelectorAll("[data-number]");
93+
const operationButtons = document.querySelectorAll("[data-operation]");
94+
const equalsButton = document.querySelector("[data-equals]");
95+
const deleteButton = document.querySelector("[data-delete]");
96+
const allClearButton = document.querySelector("[data-all-clear]");
97+
const previousOperandTextElement = document.querySelector(
98+
"[data-previous-operand]"
99+
);
100+
const currentOperandTextElement = document.querySelector(
101+
"[data-current-operand]"
102+
);
103+
104+
const calculator = new Calculator(
105+
previousOperandTextElement,
106+
currentOperandTextElement
107+
);
108+
109+
numberButtons.forEach((button) => {
110+
button.addEventListener("click", () => {
111+
calculator.appendNumber(button.innerText);
112+
calculator.updateDisplay();
113+
});
114+
});
115+
116+
operationButtons.forEach((button) => {
117+
button.addEventListener("click", () => {
118+
calculator.chooseOperation(button.innerText);
119+
calculator.updateDisplay();
120+
});
121+
});
122+
123+
equalsButton.addEventListener("click", (button) => {
124+
calculator.compute();
125+
calculator.updateDisplay();
126+
});
127+
128+
allClearButton.addEventListener("click", (button) => {
129+
calculator.clear();
130+
calculator.updateDisplay();
131+
});
132+
133+
deleteButton.addEventListener("click", (button) => {
134+
calculator.delete();
135+
calculator.updateDisplay();
136+
});

0 commit comments

Comments
 (0)