不使用eval()绘制图形

Draw graph without using eval()

本文关键字:绘制 图形 eval      更新时间:2023-09-26

我已经创建了一个Chrome扩展,可以绘制用户输入的数学方程的图形。为了轻松地获得y的值,我使用了eval()(是的,我知道它不好),因为最简单的方法来实现它。

var equ = $("#equ1").val();                //some element
//let's say equ = "2(2^x) + 3x"
//some magic code
//equ becomes "2*(pow(2,x))+3*x"
for(var x = -10; x < 10; x++){
    var y = eval(equ.replace(/x/ig, x));   //calculate y value
    drawPoint(x, y);
}
console.log("Graphing done.");

但是,由于新的manifest版本2,我不能再使用eval了。我想不出任何操作字符串的方法。任何想法?

干净的方法:您可以尝试使用Jison解析表达式并从输入字符串构建AST。然后,将函数与AST节点关联,这些函数将节点表示的操作应用于给定给它们的数据。这意味着您必须显式地将您想要支持的每个数学表达式放入语法和节点代码中,但另一方面,这也将使支持JS不支持的数学运算符变得更容易。如果你愿意投入一些时间,这可能是你要走的路。

肮脏的方式:如果您的扩展在正常网站上使用,您可能能够通过向网站注入<script>元素来做某种间接的eval -然而,这可能是不安全的。

你试过New Function() ...吗??

var some_logic = "2*(Math.pow(2,x))+3*x";
args = ['x', 'return (' + some_logic + ');'];
myFunc = Function.apply(null, args);
for (var x = -10; x < 10; x++) {
    var y = myFunc(x);
    console.log(x, y);
}
console.log("Graphing done.");

提琴- http://jsfiddle.net/atif089/sVPAH/