When to Use `eval()` vs `new Function()` in JavaScript?

Distinguishing eval() and new Function() in JavaScript

In JavaScript, developers often encounter two functions that appear to perform a similar task: eval() and new Function(). While both functions evaluate strings as code, their underlying mechanisms and implications are significantly different.

eval() vs new Function()

The eval() function evaluates a string as a JavaScript expression within the current execution scope. This means that it has access to local variables defined in the current scope. In contrast, new Function() parses the JavaScript code stored in a string into a function object, which can then be called. This function object is created in a separate scope, and thus cannot access local variables of the calling environment.

Example

To illustrate this distinction, consider the following code:

var evaluate = function(string) {
    return eval('(' + string + ')');
}

var func = function(string) {
    return (new Function( 'return (' + string + ')' )());
}

console.log(evaluate('2 + 1'));
console.log(func('2 + 1'));

Both functions will output the expected result of 3. However, if we modify the code to utilize local variables, the difference becomes apparent:

function test1() {
    var a = 11;
    eval('(a = 22)'); // Modifies the local variable within the `test1` function
    alert(a);            // Alerts 22
}

In this case, using eval() would modify the local variable a because the evaluation occurs within the test1 function's scope. However, if we used new Function('return (a = 22);')() instead, the local variable a would remain unaffected because the code runs in a separate scope.

Security and Considerations

It is important to note that eval() and new Function() can pose security risks when used with untrusted data. Malicious input can potentially expose sensitive information or execute arbitrary code. Therefore, it is strongly recommended to avoid using these functions unless absolutely necessary.

Conclusion

In summary, eval() and new Function() operate differently in JavaScript. eval() evaluates strings within the current execution scope, while new Function() creates a new scope for the evaluation. Understanding this distinction is crucial for effective JavaScript programming and maintaining security.

The above is the detailed content of When to Use `eval()` vs `new Function()` in JavaScript?. For more information, please follow other related articles on the PHP Chinese website!