I am trying to create a simple online calculator that can run basic calculations in JavaScript.

I have managed to create the interface so that numbers and operators and stored in a form field.

What I would like to be able to do is pass the values within the form field to a function that will calculate the total of the form field.

The form field could contain anything from a simple "10 + 10" to more complex equations using brackets. The operators in use are +, -, *, and /.

Is it possible to pass the form field's text (a string) to a JavaScript function that can recognize the operators and the perform the function of the operation on the values?

A possible value in the text field would be:

120/4+130/5

The function should then return 56 as the answer. I have done this in JavaScript when I know the values like this:

function WorkThisOut(a,b,c,d) {

var total = a/b+c/d;

alert (total);
}

WorkThisOut(120,4,130,5);

I am trying to create a simple online calculator that can run basic calculations in JavaScript.

I have managed to create the interface so that numbers and operators and stored in a form field.

What I would like to be able to do is pass the values within the form field to a function that will calculate the total of the form field.

The form field could contain anything from a simple "10 + 10" to more complex equations using brackets. The operators in use are +, -, *, and /.

Is it possible to pass the form field's text (a string) to a JavaScript function that can recognize the operators and the perform the function of the operation on the values?

A possible value in the text field would be:

120/4+130/5

The function should then return 56 as the answer. I have done this in JavaScript when I know the values like this:

function WorkThisOut(a,b,c,d) {

var total = a/b+c/d;

alert (total);
}

WorkThisOut(120,4,130,5);

What I would like to be able to do is pass the full value "120/4+130/5" to the function and it be able to extract the numbers and operators to create the total.

Does anyone have any ideas on how this could be done or if it is even possible? this may get more complex where I may need to pass values in parentheses "(120/4)+(130/5)"

• javascript
• jquery

• 7 Whatever you do, stay the hell away from eval – Aren Commented Jun 1, 2012 at 21:44
• 2 @Aren Why? There are a lot of issues with eval, but as long as the input is secure, there's no doubt it's the fastest formula parser for Javascript developers. I don't see the point in pretending it doesn't even exist. – MaxArt Commented Jun 1, 2012 at 21:52
• You can use eval, as long as you run it from an iframe in a domain that's only meant for that purpose and can't access your own domain. – Ruan Mendes Commented Jun 1, 2012 at 21:54
• His input is a text input, he is going to have to validate the input, that means he is pretty much doing all the work of parsing the input into computable components anyway, why not just save the security risk and glue the pieces together? eval is great if you can trust the input, but can he trust his input? – Aren Commented Jun 1, 2012 at 22:06
• @Aren You can pass the input to be run inside an iframe in a different domain. – Ruan Mendes Commented Jun 1, 2012 at 22:12

5 Answers 5

I may get blasted for this. But, here it goes anyway.

There are three solutions I can think of for this:

1. Implement your own parser, lexer and parse out the code. That's not super easy, but it may be a great learning experience.
2. Run an eval under a subdomain meant only for that, so that scripts can't maliciously access your site
3. Sanitize the input to contain only 12345678790+-/*().

 eval(input.replace(/[^0-9\(\)\+\-\*\/\.]/g, ""));

Please blast away with tricks to get around this solution

You can use the expression parser included with the math.js library:

http://mathjs.org

Example usage:

math.eval('1.2 / (2.3 + 0.7)');   // 0.4
math.eval('5.08 cm in inch');     // 2 inch
math.eval('sin(45 deg) ^ 2');     // 0.5
math.eval('9 / 3 + 2i');          // 3 + 2i
math.eval('det([-1, 2; 3, 1])');  // -7

It is pretty hard to do much damage with eval if you don't allow identifiers.

function reval(string){
    var answer='';
    if(/^[\d()\/*.+-]+$/.test(str)){
        try{
            answer= eval(str);
        }
        catch(er){
            answer= er.name+', '+er.message;
        }

    }
    return answer;
}

what about eval?

consider calc as the id of textfield. then

$('#calc').change(function(e){                
    alert(eval($(this).val()));
})

but remember to validate input before processing.

This is a pretty old topic, but for the new visitors who have similar problem: the string-math package calculates the [String] equations like in the sample above 120/4+130/5. It also recognizes parentheses.