3.7. Evaluating eval()

In a compiled language like C# and Visual Basic, it is difficult to create and use code dynamically. The .NET Framework provides the CodeDOM (code document object model) classes for defining functionality and then producing the equivalent code, but this is not typically employed during code execution, because of its difficulty. JavaScript is dynamic in that it allows types to be created and modified on the fly. Furthermore, it natively supports the ability in the eval() function to have any arbitrary script executed. It functions just as if it were a predefined piece of code. This means that you can easily write code that uses runtime values during code execution to create new code that is then executed. Essentially, you can create and execute code on the fly based on other input and variables.

Variable assignments can be based on any runtime condition and used elsewhere in JavaScript code. Listing 3-23 assigns some names to variables and then creates a string which is a piece of code that aggregates the values into a single variable and then displays that variable. Note that the values are pulled together into a piece of code that will use them all. This is distinctly different from having a piece of code that combines strings. The variables happen to be strings, but the eval statement is simply executing a piece of code passed to it as a string.

Example 3-23. Using eval()
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Using eval</title>

    <script type="text/javascript">
        var aName = "Sofia";
        var anotherName = "Henri";
        var yetAnotherName = "Kalle";

var stopAlready = "and Tuija";

        var someCode = "var names = '" + aName + ", " + anotherName + ", " +
           yetAnotherName + ", " + stopAlready + "'";
        var moreCode = "eval(someCode); alert(names);";

        function showNames() {
            eval(moreCode);
        }

        showNames ();
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
    </div>
    </form>
</body>
</html>

Running this code will display your list of names in an alert, as illustrated in Figure 3-14.

Figure 3-14. Figure 3-14

Of course, just gathering some strings and displaying them can be accomplished without the use of the eval() function. However, if you find yourself iterating over a collection in code where you are writing repetitive code in a pattern, consider whether eval() might make the code easier to read and maintain. The eval() function is a powerful way to execute any arbitrary JavaScript code on the fly. In this example, the call to showNames() results in performing an eval() on the moreCode variable, which in turn evaluates the variables and displays the values. It is a convoluted way to get the job done, but the point is that you can compose code based on dynamic values.

The eval() function does not come without tradeoffs. Code executed with eval() is generally slower than code run directly. Having code that runs other code is a level of indirection that comes at a price. Numerous articles and blog posts advocate never using eval() at all. Not only is performance a concern, but security comes into play as well. It is very tempting to use eval() to operate on user input, but user input cannot be trusted. In the confines of the browser sandbox, much of what a user might try to do would not reveal anything interesting, but treating user input as trusted code and executing it can open all sorts of unforeseen security concerns. Generally, you should never use eval() on user input.

One common use of eval() is to access fields of an object. Instead of calling eval("something." + someField), you can usually switch to using something["someField"]. This is generally more intuitive for others to read, easier to maintain, and faster in the browser.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset