重写公式字符串以用Math.pow（a，b）替换^ b

Question

I'm at the moment trying to plot formulas on HTML5 <canvas> by letting the user put in a formula. This works great through eval() ; however, the ^ means bitwise XOR in Javascript, while it should mean 'to the power of' in a formula.

So basically I'd have to rewrite something like x^4 to Math.pow(x, 4) . I came up with using regular expressions. This one however only works to a certain extent:

"x^4".replace(/(.*)\\^(.*)/g, "Math.pow($1, $2)")

It does rewrite x^4 to Math.pow(x, 4) , but for more advanced formulas this goes wrong. For example, 2 + x^4 is rewritten as Math.pow(2 + x, 4) , while it should of course be 2 + Math.pow(x, 4) . Moreover, if the exponent has brackets around it, eg 2^(x+1) + 3 , it should be rewritten to Math.pow(2, x+1) + 3 instead of Math.pow(2, x+1 + 3) , of course.

How would I go about rewriting this so that only the correct parts are put into the pow function? I really do not see where to start, so any tips would be greatly appreciated.

Answer 1

This is a tricky one. What you're talking about here is an expression parser.

You might want to take a look at Jison , which is designed to help people solve this type of problem.

Regular expressions aren't really the best way to do parsing of tokenized strings. One of Jison's demos is precisely what you're looking for, in terms of expression parsing, leaving you to work on the fun stuff of function graphing.

Answer 2

I doubt this is even doable with regex. The regex flavor in JS doesn't support recursive patterns (and it would be extremely cumbersome to do it even with that), so you're out of luck with complex expressions such as ((x + 2) * 3)^(x ^ (2 * x)) .

If you want to be able to do transformations like this on the expression, you'll probably have to use a proper tokenizer and parser in order to get the structure out of it.

Answer 3

    var caretReplace = function(_s) {
    if (_s.indexOf("^") > -1) {
        var tab = [];
        var powfunc="Math.pow";
        var joker = "___joker___";
        while (_s.indexOf("(") > -1) {
            _s = _s.replace(/(\([^\(\)]*\))/g, function(m, t) {
                tab.push(t);
                return (joker + (tab.length - 1));
            });
        }

        tab.push(_s);
        _s = joker + (tab.length - 1);
        while (_s.indexOf(joker) > -1) {
            _s = _s.replace(new RegExp(joker + "(\\d+)", "g"), function(m, d) {
                return tab[d].replace(/(\w*)\^(\w*)/g, powfunc+"($1,$2)");
            });
        }
    }
    return _s;
};

1. console.log(caretReplace("(3*(f(x^2)-2)^2+1^5-g(2^3+1)^5)^(9-2^3)")); gives : Math.pow((3*Math.pow((f(Math.pow(x,2))-2),2)+Math.pow(1,5)-Math.pow(g(Math.pow(2,3)+1),5)),(9-Math.pow(2,3)))

2. Your math expression must be with well balanced opened and closed parenthesis (valid expression).

3. You can replace "Math.pow" by any function name you want.

4. I've done this by replacing all parenthesis, from the most inner to the most outer, with non-math texts (" _joker _0"," _joker _1", etc...). At the end I parse all theses strings hierarchically, to replace carets on non parenthesis expressions.

Answer 4

Typically this type of problem is approached using lexers and parsers , not regexes. Because of the order of operations of the mathematical expressions, you need to understand the whole expression (and all of its parts), not just the power-of portion. I am not sure which parsers are generally used for Javascript, but it seems ANTLR has a target for generating Javascript parsers: http://www.antlr.org/wiki/display/ANTLR3/ANTLR3JavaScriptTarget