CODEWITHSUNDEEP
javascripteval
AJlearn
AJlearn

Reputation: 5

eval() is not working

So I try build my own Javascript calculator as an exercise. Unfortunately when I try to use the eval() function with "=" button click to convert string into result, for example "2+2*2", nothing happens. Here's my code:

var draw = document.getElementById("result");

function calc(x) {
 draw.innerHTML += x;
 if (x === '=') {
    draw.innerHTML = eval(draw.innerHTML);
 } else if (x === 'c') {
    draw.innerHTML = '0';
 } else if (x === 'sqrt') {
    draw.innerHTML = Math.sqrt(eval(draw.innerHTML));
 } else if (x === 'pow') {
    draw.innerHTML = Math.pow(eval(draw.innerHTML));
 }
}

Upvotes: 0

Views: 389

Answers (1)

Jonas Wilms
Jonas Wilms

Reputation: 138497

draw.innerHTML += x;

means if e.g. your string is 2*2 and you call

calc("sqrt")

the draws content will be

 "2*2sqrt"

and thats not a valid expression, therefore the eval will fail. You may want to only concat if its not an operation:

 function calc(x) {
  if (x === '=') {
    return draw.innerHTML = eval(draw.innerHTML);
  } else if (x === 'c') {
     return draw.innerHTML = '0';
  } else if (x === 'sqrt') {
     return draw.innerHTML = Math.sqrt(eval(draw.innerHTML));
  } else if (x === 'pow') {
     return draw.innerHTML = Math.pow(eval(draw.innerHTML),2);
  }
  draw.innerHTML += x;
 }

That can be beautified with an object as a lookup table:

const result = n => eval(n),
           sqrt = n => Math.sqrt(eval(n)),
           pow = n => Math.pow(eval(n),2),
           default = (n, add) => n + add;

function calc(in){
  draw.innerHTML = ({"=":result, sqrt, pow}[in] || default)(draw.innerHTML, in);
}

Upvotes: 1

Related Questions