User input JavaScript eval with variable declarations

Question

As part of a homework I am trying to implement a JavaScript console similar to the one available in Firebug in a browser environment. From what I've picked up, eval() seems to be the easiest way to do this. However, my code runs into some problems on even very basic user input. For example:

var number = 5;

Causes a syntax error rather than just evaluating to undefined like it would in Firebug. Because of this I can't seem to declare variables at all inside the eval string. If I do something more simple like:

3 + 4 * Math.PI

It works correctly. I have tried to find an example of someone using eval() on a string containing a variable declaration, and I just can't seem to find anyone doing this.

Do I need to parse the user input completely using regular expressions before compiling it into a new string for eval()?

Can eval() understand semicolons as line breaks? I can't find people using these either.

function runMiniFirebug() {
    var userInput = document.getElementById("user-input").value;
    try {
        var userOutput = eval('(' + userInput + ')');
        document.getElementById("js-output").innerHTML += '<p class="input">>>>' + userInput + '<p>';
        document.getElementById("js-output").innerHTML += '<p class="ouput">' + userOutput + '<p>';
    }
    catch(error) {
        document.getElementById("js-output").innerHTML += '<p class="input">>>>' + userInput + '<p>';
        document.getElementById("js-output").innerHTML += '<p class="error">' + error.message + '<p>';
    }
}

EDIT: So it seems the added parens are causing the error. This is a section from my instructors slides. Is the information incorrect, or am I just interpreting it incorrectly?

Strings that are delimited with { ... }

– You have to add extra parens so that JavaScript will know that the braces are for object literals, not for delimiting statements.

• It never hurts to do this, so add parens routinely

– var test2 = "{ firstName: 'Jay', lastName: 'Sahn' }";

– var person = eval("(" + test2 + ")");

tckmn · Accepted Answer · 2014-03-05 03:38:19Z

6

var userOutput = eval('(' + userInput + ')');

Why are you wrapping with parentheses? This creates the statement

(var number = 5;)

which is invalid syntax.

Simply remove the '(' + and + ')'.

As for your edit, that is referring to only evaluating single expressions. var number = 5; is not an expression, nor is alert(1 + 1); alert(2 + 2);. Wrapping either in parentheses will cause an error.

edited Mar 5, 2014 at 3:38

answered Mar 5, 2014 at 3:29

tckmn

59.7k27 gold badges118 silver badges156 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

sage88 Over a year ago

Going to add the why to this in my question since it's formatted. Removing them does seem to fix my problem...

tckmn Over a year ago

@sage88 Yes, that should be what the user inputs, not done by you. What if someone really wants a block, like {alert(1+1); alert(2+2);}?

sage88 Over a year ago

Added the reason for why I had them to my original question, am I interpreting his statement incorrectly?

sage88 Over a year ago

Thanks for your feedback. Thinking about wrapping multiple lines of javascript in parens makes it obvious why my original code could never work.

Collectives™ on Stack Overflow

User input JavaScript eval with variable declarations

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related