|
1 | 1 | # Eval: run a code string
|
2 | 2 |
|
3 |
| -The built-in `eval(code)` function allows to execute a string of `code`. |
| 3 | +The built-in `eval` function allows to execute a string of `code`.; |
| 4 | + |
| 5 | +The syntax is: |
| 6 | + |
| 7 | +```js |
| 8 | +let result = eval(code); |
| 9 | +``` |
4 | 10 |
|
5 | 11 | For example:
|
6 | 12 |
|
@@ -56,46 +62,46 @@ Without `use strict`, `eval` doesn't have its own lexical environment, so we wou
|
56 | 62 |
|
57 | 63 | ## Using "eval"
|
58 | 64 |
|
59 |
| -In modern programming `eval` is used very sparingly. There's also an expression "eval is evil". |
| 65 | +In modern programming `eval` is used very sparingly. It's often said that "eval is evil". |
60 | 66 |
|
61 |
| -The reason is simple: long, long time ago JavaScript was a weak language, many things could only be done with `eval`. But that time has passed. |
| 67 | +The reason is simple: long, long time ago JavaScript was a much weaker language, many things could only be done with `eval`. But that time passed a decade ago. |
62 | 68 |
|
63 |
| -Right now, there's almost no reason to use `eval`. If someone is using it, there's a good chance they can replace it with a modern language construct, or [JavaScript Modules](info:modules). |
| 69 | +Right now, there's almost no reason to use `eval`. If someone is using it, there's a good chance they can replace it with a modern language construct or a [JavaScript Module](info:modules). |
64 | 70 |
|
65 |
| -Still, if you're sure you need `eval`, please note that its ability to access outer variables has side-effects. |
| 71 | +Still, if you're sure you need to dynamically `eval` a string of code, please note that its ability to access outer variables has side-effects. |
66 | 72 |
|
67 |
| -Code minifiers (tools used before JS gets to production, to compress it) replace local variables with shorter ones. That's safe, unless `eval` is used. When they see `eval`, they thing it might use local variables, so they don't replace all local variables that might be visible from `eval`. That negatively affects code compression ratio. |
| 73 | +Code minifiers (tools used before JS gets to production, to compress it) replace local variables with shorter ones for brewity. That's usually safe, but not if `eval` is used, as it may reference them. So minifiers don't replace all local variables that might be visible from `eval`. That negatively affects code compression ratio. |
68 | 74 |
|
69 |
| -Also, renaming a local variable becomes more dangeours overall. |
| 75 | +Using outer local variables inside `eval` is a bad programming practice, as it makes maintaining the code more difficult. |
70 | 76 |
|
71 |
| -Using outer variables inside `eval` is a bad programming practice. |
| 77 | +There are two ways how to evade any eval-related problems. |
72 | 78 |
|
73 |
| -There are two solutions. |
| 79 | +**If eval'ed code doesn't use outer variables, please call `eval` as `window.eval(...)`:** |
74 | 80 |
|
75 |
| -**If you don't use outer variables, please call `eval` as `window.eval(...)`:** |
| 81 | +This way the code is executed in the global scope: |
76 | 82 |
|
77 | 83 | ```js untrusted refresh run
|
78 |
| -let a = 1; |
| 84 | +let x = 1; |
79 | 85 | {
|
80 |
| - let a = 5; |
81 |
| - window.eval('alert(a)'); // 1 |
| 86 | + let x = 5; |
| 87 | + window.eval('alert(x)'); // 1 (global variable) |
82 | 88 | }
|
83 | 89 | ```
|
84 | 90 |
|
85 |
| -**If your code needs variables, execute it with `new Function`:** |
| 91 | +**If your code needs local variables, execute it with `new Function` and pass them as arguments:** |
86 | 92 |
|
87 | 93 | ```js run
|
88 | 94 | let f = new Function('a', 'alert(a)');
|
89 | 95 |
|
90 | 96 | f(5); // 5
|
91 | 97 | ```
|
92 | 98 |
|
93 |
| -The `new Function` construct is explained in the chapter <info:new-function>. It creates a function from a string. Local variables can be passed to it as parameters, like in the example above. |
| 99 | +The `new Function` construct is explained in the chapter <info:new-function>. It creates a function from a string, also in the global scope. So it can't see local variables. But it's so much clearer to pass them explicitly as arguments, like in the example above. |
94 | 100 |
|
95 | 101 | ## Summary
|
96 | 102 |
|
97 |
| -- A call to `eval(code)` runs the code and returns the result of the last statement. |
98 |
| -- Rarely used in modern JavaScript. |
| 103 | +A call to `eval(code)` runs the string of code and returns the result of the last statement. |
| 104 | +- Rarely used in modern JavaScript, as there's usually no need. |
99 | 105 | - Can access outer local variables. That's considered bad practice.
|
100 |
| -- To execute the code in the global scope, use `window.eval(code)`. |
101 |
| -- If your code needs some data from the outer scope, use `new Function` and pass it as arguments. |
| 106 | +- Instead, to `eval` the code in the global scope, use `window.eval(code)`. |
| 107 | +- Or, if your code needs some data from the outer scope, use `new Function` and pass it as arguments. |
0 commit comments