JavaScript

What is eval() function in JavaScript

What do you do when you have an expression or a statement and you want to evaluate it? The eval() function is there to facilitate you. In JavaScript, we use the eval() function to evaluate as well as assess an expression or a statement. There is much more about that. Let’s proceed through everything we need to know about eval().

What is the eval() function?

Whenever you tackle javascript and you come to a point where you desire to evaluate an expression, the eval() function is there. It is, in fact, a global function of JavaScript which we use to assess the designated string as a code of JavaScript and then carry it out or perform the desired operation on it.

Additionally, the eval() function works differently in different scenarios. For an argument to be evaluated, if it’s an expression, the eval() function takes it as an expression and then evaluates it.

In case of an argument to be a statement of JavaScript, the eval() function is going to deal with it as a statement and then executes it.

Hint: The eval() function does not perform the arithmetic operation as this operation is carried out by JavaScript automatically.

Syntax for eval function

Here is the syntax for the eval function:

eval(string)

The eval is a function whereas the inside value is known as a parameter. As you can see, the string is the parameter. Depending upon the nature of the program, the string can be an expression of JavaScript, a sequence of statements, or even a single statement.

Condition for the Return value

For the eval() function to perform and retrieve results, we need to put some values into the function. In case of an empty value, it will return undefined.

Examples of the eval function

Let’s try a couple of examples to demonstrate and understand the true working of the eval() function.

Example 1
We are going to give two examples in this regard and let’s see if you can judge the right answer:

a = eval(new String('5+5'));
b = eval('5+5');

console.log(a);
console.log(b);

What do you think? What is going to be the output for a and b

Let’s talk about the former example first. In that case, suppose we have specified the constructor of a string, the eval() function will return the object of the string. It won’t perform the operation of the string.

Hence, the output for a will be an object of the string that will contain “5 + 5”, not the answer to this arithmetic operation.

Now let’s come to the variable b, in the argument of eval() function, we can’t see any string inside. Therefore, the eval() function is going to evaluate the expression and the answer will be 10 after being evaluated.

Output

Example 2
In this example, we will try to pass variables to the eval() function and see what will happen:

var f = 6, g = 7, h = 8, sum, mul, sub;
sum = eval(" f + g + h ");
mul = eval(" f * g * h");
sub = eval(" f - g");

console.log(sum);  
console.log(mul);  
console.log(sub);

In the above code, we clearly initiated the variables f,g, and h with values. Then we performed some basic arithmetic operations in order to assess the functionality of the eval() function. That’s how the eval() function behaves in case of no string. It evaluates the expression being put inside.

The result is going to be

Result

Example 3
Let’s try to put something more complex like calling a function and assigning that function call to a variable:

var test;

function func1(m, n)
{
  return m * n;
}

eval("test = func1(30, 20);");
console.log(test);

How are you going to assess the output? It’s simple. Here’s how:

First, we declared the variable test. Then we introduce the function as “func1” which consists of two arguments “m” and “n”. The return value of that function is going to be the multiplication of these two parameters “m” and “n”.

The result is going to be stored in the test variable and the function will be called by the eval() function.

Hence, the output is going to be

Limitations

  • It is considered insecure
  • Slow
  • The code gets unreadable while dealing with it

Conclusion

In this topic, we have achieved a fine level of understanding of the eval() function, the functionality of the eval() function as well as its behaviors in specific conditions.

We started our article from the description of the eval() function, after that, by stating out the syntax, limitations, and examples, we have covered every aspect of the eval() function so that the reader can understand the concept in the best possible way.

About the author

Shehroz Azam

A Javascript Developer & Linux enthusiast with 4 years of industrial experience and proven know-how to combine creative and usability viewpoints resulting in world-class web applications. I have experience working with Vue, React & Node.js & currently working on article writing and video creation.