What is eval() ?

Question

now these make me confused a lot.

var a = "1";
var b = "2+3";
var c = "2-3";
var d = "2*3";
var e = "2/3";
var f = "2%3";
document.write(eval(a+b));

the output from codeplayground are :
eval(a+b) is 15
eval(a+c) is 9
eval(a+d) is 36
eval(a+e) is 4
eval(a+f) is 0

Can anyone explain the output ?

Answer 1

eval(a+b) => ("1" +"2+3") => ("12+3") => 15
eval(a+c) => ("1"+"2-3") => ("12-3") => 9
eval(a+d) => ("1"+"2*3") => ("12*3) => 36
eval(a+e) => ("1"+"2/3") => ("12/3") => 4
eval(a+f) => ("1"+"2%3") => ("12%3") => 0

Answer 2

eval is "evil" as described by Douglas Crockford. It's a function property of the global object and takes a "string". It executes or evaluates all string content passed to it, which includes expressions, statement etc.

it's one of the " bad design" quirks of the JS language. This is because when not used carefully it can cheats the language "Lexes or Tokenizing" which raises lots of bad performance issues in JS.

Read more: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval

Answer 3

@Cal Baksh
you are right.
the purpose for me to post this questions, because i encounter some eval() question in challenge. and i dont want to lose again because of eval().

anyway this is a question from cheese in challenge

var a = "1";
var b = "3*5";
document.write(eval(a+b));

now without code playground, can you guess the output ?

Answer 4

@Setiawan it was named by Douglas Crockford as "evil" because many JavaScript developers as at that time from 2003 misused it. Didn't understand the performance and security issues it posed.

Answer 5

@Ben Bright
Thank you so much. now i get it.
and you too @Calvin

Answer 6

Thanks for @Setiawan.
Make me understand eval function now. 🤗

Answer 7

All your variables are strings. The addition operator concatenates strings. Can you see the rest?

Answer 8

It might be performing the operation in the variable, then concatenating the two variables. When you take the equation out of a string, it should work normally.

Answer 9

It is not adding 10. Instead, it is taking 5 (2+3) and 1, then putting them together (1+5), but instead of adding, it is concatenating (I do not know why)

Answer 10

@Cal Baksh
i try this in codeplayground :

var a = "1";
var b = "2+9";
document.write(eval(a+b));

guess what, the output is 21.
so it calculate b first then add 10.

Answer 11

@Ben Bright
if eval is evil, why many user post eval()-related question in Challenge ?
its not fair man, i lost a lot because of eval().
the code above is inspired from @Cheese question in Challenge.

Answer 12

Perhaps it is because it is trying to both add and concatenate the strings. In codeplayground, I tried the code you showed here, and found the same results, but when I removed the equations/numbers from strings, it added the two:

var a = "1";
var b = "2+9";
document.write(eval(a+b));

outputs 21

var a = 1;
var b = 2+9
document.write(eval(a+b));

outputs 12

Answer 13

eval(a+b) = eval ("12+3") is 15
eval(a+c) = eval ("12-3") is 9
eval(a+d) = eval ("12*3") is 36
eval(a+e) = eval ("12/3") is 4
eval(a+f) = eval ("12%3") is 0

Answer 14

thank you for the respond
but guys , what i want to know is how the output as above. i can't find the pattern.
i understand eval but this one make me stupid again.

for a+b it add number in b first than add ten. why? variable a is 1 but it is calculated as ten.
if i change value var a to 2, then it add number in b first then add twenty. what ? should it 2 not twenty.
the same rule apply to a-b.
but when see a*b is 36 i am confused
then a/ b is 4. what?
where is the number came from. it blow my mine when a%b is 0.

Can you explain how the above code work?
its not about the normal eval but just curious about this one.
or this is example of undefined behaviour.