Calculator assignment - "0"-prefixed octal literals are deprecated. But I don't think I'm using them

Tell us what’s happening:
Hi all,

I’m working on the calculator assignment, and my test #7 is failing when I try to set the state “0” to my “operations” variable.

The error I’m getting is:

SyntaxError: “0”-prefixed octal literals are deprecated; use the “0o” prefix instead

As far as I know I’m not using any octal literals anywhere in my code? Is it related to the eval function call?

Any help would be greatly appreciated.

Here’s my pen: https://codepen.io/double-dash-dino/pen/NWvORWN?editors=0111

Your code so far

Here’s my JS file:

import React, {
  useState,
  useEffect
} from "https://cdn.skypack.dev/react@17.0.1";
import ReactDOM from "https://cdn.skypack.dev/react-dom@17.0.1";

const Calculator = () => {
  const [operations, setOperations] = useState("");
  const [result, setResult] = useState("0");

  const clearHandler = () => {
    setOperations("0");
    setResult("0");
  };

  const reOperators = /\+|\-|\*|\//;

  const numberClickHandler = (event) => {
    if (!reOperators.test(operations)) {
      setResult(operations);
    }
    if (
      // Check for mutliple zeros at the start of an number
      operations.length !== 0 &&
      operations[operations.length - 1] === "0" &&
      operations[operations.length - 2] === ("+" || "-" || "*" || "/")
    ) {
      setOperations(operations.slice(0, -1) + event.target.value);
    } else if (
      operations.length !== 0 &&
      operations[operations.length - 1] === "." &&
      event.target.value === "."
    ) {
      setOperations(operations);
    } else {
      setOperations(operations + event.target.value);
    }
  };

  const equalsHandler = () => {
    setResult(operations);
  };

  return (
    <div className="App">
      <div className="calculator-card">
        <div className="calculator-screen">
          <div className="calculator-operations" id="display">
            {operations}
          </div>
          <div className="calculator-result">{eval(result)}</div>
        </div>
        <div className="calculator-pad">
          <div className="calculator-numbers">
            <button
              className="number-button"
              id="seven"
              value="7"
              onClick={numberClickHandler}
            >
              7
            </button>
            <button
              className="number-button"
              id="eight"
              value="8"
              onClick={numberClickHandler}
            >
              8
            </button>
            <button
              className="number-button"
              id="nine"
              value="9"
              onClick={numberClickHandler}
            >
              9
            </button>
            <button
              className="number-button"
              id="four"
              value="4"
              onClick={numberClickHandler}
            >
              4
            </button>
            <button
              className="number-button"
              id="five"
              value="5"
              onClick={numberClickHandler}
            >
              5
            </button>
            <button
              className="number-button"
              id="six"
              value="6"
              onClick={numberClickHandler}
            >
              6
            </button>
            <button
              className="number-button"
              id="one"
              value="1"
              onClick={numberClickHandler}
            >
              1
            </button>
            <button
              className="number-button"
              id="two"
              value="2"
              onClick={numberClickHandler}
            >
              2
            </button>
            <button
              className="number-button"
              id="three"
              value="3"
              onClick={numberClickHandler}
            >
              3
            </button>
            <button
              className="number-button"
              id="zero"
              value="0"
              onClick={numberClickHandler}
            >
              0
            </button>
            <button
              className="number-button"
              id="decimal"
              value="."
              onClick={numberClickHandler}
            >
              .
            </button>
          </div>
          <div className="calculator-operators">
            <button
              className="operator-button"
              id="add"
              value="+"
              onClick={numberClickHandler}
            >
              +
            </button>
            <button
              className="operator-button"
              id="subtract"
              value="-"
              onClick={numberClickHandler}
            >
              -
            </button>
            <button
              className="operator-button"
              id="multiply"
              value="*"
              onClick={numberClickHandler}
            >
              x
            </button>
            <button
              className="operator-button"
              id="divide"
              value="/"
              onClick={numberClickHandler}
            >
              /
            </button>
          </div>

          <div className="calculator-controls">
            <button
              className="control-button"
              id="clear"
              onClick={clearHandler}
            >
              A/C
            </button>
            <button
              className="control-button"
              id="equals"
              onClick={equalsHandler}
            >
              =
            </button>
          </div>
        </div>
      </div>
    </div>
  );
};

ReactDOM.render(<Calculator />, document.getElementById("root"));

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:94.0) Gecko/20100101 Firefox/94.0

Challenge: Build a JavaScript Calculator

Link to the challenge:

Your calculator is allowing 0 to be entered twice if pressed first ‘00’ causing a crash. Also, if you start with a decimal ‘.’ first it will crash instead of resulting in ‘0.’

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.