Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

127
Views
Calculator - issue with multiple digit / operators operations

Newbie here, I am stuck with my Calculator project and cannot continue. There's something wrong with my code an cannot figure out what.

So the issue involves operations on multiple digit numbers (e.g. 22) as well as multiplying / dividing after summing / deducting.

Previously I was struggling with multiple operations in general, but it seems to be now working (with 1 digit numbers only though). Whenever I insert, e.g. 23, the function right away assigns 23 to both first and second operands and gives me 46.

The same thing happens when I use an operator in the 2nd operation which is different than the one used in the first operation (e.g if I use sum operator twice and then deduct, my result will be zero as the result gets assigned to both operands and continues with the operation).

Could someone advise what is the issue with this code? I think it's because of "operand1" variable. The expected behavior would be for the function to stop after each click, but then as soon as the operand1 value changes to "empty" again, the code continues. I tried to override this but nothing I come up with works, I feel like I'm missing something basic.

Thanks in advance!

let add = (a, b) => a + b;
let subtract = (a, b) => a - b;
let multiply = (a, b) => a * b;
let divide = (a, b) => a / b;

function operate(operator, a, b) {
 if (operator === '+') {
  return add(a, b);
 } else if (operator === '-') {
  return subtract(a, b);
 } else if (operator === '*') {
  return multiply(a, b);
 } else { return divide(a, b); }
};

const display = document.querySelector("h1"); // display
const numButtons = document.querySelectorAll(".num"); // 0 - 9
const operateButtons = document.querySelectorAll(".operator"); // +, -, *, /
const equals = document.querySelector('#equals') // =
const clearBtn = document.querySelector('#clear'); // AC

let displayValue = []; // add clicked numbers to array
let displayNumbers;  // joined array
let operations = ['a','operator','b'];
let operand1 = "empty"; // value that shows if 1st num has already been selected

numButtons.forEach((button) => {
 button.addEventListener('click', function() {
  displayValue.push(this.innerText);
  displayNumbers = displayValue.join("");
  display.textContent = displayNumbers;

 operateButtons.forEach((button) => {
  button.addEventListener('click', function insertOperand() {
   if(operand1 === "empty") {
    operations[0] = Number(displayNumbers);
    operations[1] = this.textContent;
    displayValue = [];
    operand1 = "inserted";
   } else if (operand1 === "inserted") {
    operations[2] = Number(displayNumbers);
    result = operate(operations[1],operations[0],operations[2]);
    display.textContent = result;
    displayNumbers = result;
    displayValue = [];
    operand1 = "empty";
    button.removeEventListener('click',insertOperand);
   }
  });
 });
 });
});
about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!