calculator-out-of-control

function solve() {
  const inputScreen = document.getElementById('expressionOutput');
  const resultOutput = document.getElementById('resultOutput');
  const clearBtn = document.querySelector('.clear');
  const keysField = document.querySelector('.keys');
  let screen = [];

  const mapper = {
    '*': (params) => params.reduce((acc, cur) => acc * cur, 1),
    '/': (params) => params.reduce((acc, cur) => acc / cur),
    '+': (params) => params.reduce((acc, cur) => acc + cur, 0),
    '-': (params) => params.reduce((acc, cur) => acc - cur),
  };

  // add event listener to keys
  // keysField.addEventListener('click', updateScreen);
  Array.from(keysField.children).forEach((button) => {
    button.addEventListener('click', addSymbol);
  });

  clearBtn.addEventListener('click', clearScreen);

  // Declarations
  function addSymbol(e) {
    if (screen.includes('NaN')) {
      clearScreen();
    }

    // get value of the pressed key
    let keyPressed = e.target.value;

    // if value is equals
    if (keyPressed === '=') {
      if (screen.length === 2) {
        screen = ['NaN'];
        updateScreen();
        return;
      }

      if (screen.length === 1) {
        return;
      }

      // extract operator and numbers
      let [operator, ...nums] = removeOperators();

      // calculate
      screen = mapper[operator](nums);

      updateScreen();
      return;
    }

    // concatenate number
    let lastIndex = screen.length - 1;
    let lastElement = screen[lastIndex];

    // if the last element is a number && keyPressed is a number
    let isLongerNumber =
      !isNaN(Number(lastElement)) && !isNaN(Number(keyPressed));

    if (isLongerNumber) {
      keyPressed = lastElement + keyPressed;

      screen.splice(lastIndex, 1, keyPressed);
    } else {
      screen.push(keyPressed);
    }

    updateScreen();
  }

  function updateScreen() {
    // render result
    if (typeof screen === 'number') {
      resultOutput.innerHTML = screen;
      return;
    }

    inputScreen.innerHTML = screen.join(' ');
  }

  function clearScreen() {
    screen = [];
    resultOutput.innerHTML = '';
    updateScreen();
  }

  function removeOperators() {
    const operatorPattern = /[\*\/\+\-]/g;
    let operator = '';

    screen.forEach((ele) => {
      let matches = ele.match(operatorPattern);

      if (matches !== null) {
        // if operator differs
        if (operator && operator !== matches[0]) {
          alert("You can't use different operators in the same expression.");

          throw new Error(
            "You can't use different operators in the same expression."
          );
        }

        operator = matches[0];
      }
    });

    let expressionArr = screen.join(' ').split(operatorPattern).map(Number);
    expressionArr.unshift(operator);

    return expressionArr;
  }
}