如何使用MathCalc在JavaScript中实现基本的数学表达式计算器

本文概述

  • 1.添加MathCalc脚本
  • 2.使用MathCalc脚本
  • 现场例子
在数学学校的好日子里, 老师不允许在教室里使用计算器。小时候, 我(可能仍然)很懒惰, 因此拥有可以解决任何数学运算的电子设备(卡西欧计算器的廉价广告)的可能性简直太棒了。现在, 尽管我每天都不使用计算器, 但作为一名开发人员, 我很高兴看到其他开发人员如何解决此类问题。现在, 在JavaScript中, 使用代码执行数学运算非常简单, 至少对于程序员而言是如此, 但是如果用户是需要执行某些数学运算的用户, 那该怎么办呢?今天, 我想分享一个有用的代码片段, 即MathCalc, 该代码片段使你可以使用非常复杂的函数, 通过一个简单的字符串即可解决基本的数学表达式。是的, 就像你使用计算器一样, 键入值并替换某些公式中的值。
1.添加MathCalc脚本MathCalc脚本由@paiv编写, 其基本思想虽然难以实现, 但使用和使用非常简单。该脚本从tring解析一个数学表达式, 就像(1 + 2 + 3)/(2)这样的运算, 该运算式应返回2作为结果。
该脚本托管在GithubHist中, 因此你可以获取MathCalc脚本的副本:
然后使用script标签将文件中的脚本包括在HTML文档中:
< !-- Include MathCalc --> < script src="http://www.srcmini.com/mathcalc.js"> < /script>

你可以访问脚本的主页, 该脚本解释了更多可能的用例, 等等。解析器使用移位减少解析器实现, 该实现非常有效且没有依赖性。该库支持以下运算符:
  • ()
  • func(x)(调用)
  • -(一元)
  • ^(权力, 右联想)
  • * /%
  • +-
  • =
  • , (元组构造函数)
号码:42.3, 1e-7
2.使用MathCalc脚本MathCalc提供了不同的功能, 这些功能也将进行描述和使用。我们将通过示例向大家解释:
基本用法
基本用法是从字符串表示形式解决简单的数学运算, 在这种情况下, 我们将解决变量表达式中显示的简单加法和除法, 创建该库的新实例可让你使用它的parse方法将表达式作为第一个参数。解析器将验证语法是否正确, 如果不正确, 你可以执行操作。如果正确, 则可以使用eval方法求解表达式, 仅此而已:
// Create instance of MathCalcvar calc = new MathCalc(); // Your mathematical operationvar expression = '(1 + 2 + 3) / 3'; // Evaluate expressionvar parser = calc.parse(expression); // Check if there's a syntax errorif (parser.error) {console.error('The expression "' + expression + '" has an error', expr.error.text ); // Proceed to solve}else {// The result will be a JS number, not a stringvar result = parser.eval(); // Displays 2 as results (as expected) !console.log('The expression "' + expression + '" generates:', result); }

请注意, eval方法的结果是一个数字, 而不是字符串, 并且根据操作, 它也可能返回NaN(不是数字)。
使用变量
要像许多数学运算一样使用变量, 可以在解析器中将它们声明为对象内的第一个参数。例如, 在这种情况下, 我们的表达式将很简单x + y, 其中x的值为1, y的值为2:
// Create instance of MathCalcvar calc = new MathCalc(); // Your mathematical operationvar expression = 'x + y'; // Evaluate resultvar parser = calc.parse(expression); // Check if there's a syntax errorif (parser.error) {console.error('The expression "' + expression + '" has an error', expr.error.text ); // Proceed to solve}else {// The result will be a JS number, not a string// Insert the variables valuevar result = parser.eval({x: 1, y: 2}); // Displays 3 as results (as expected) !console.log('The expression "' + expression + '" generates:', result); }

创建自定义数学函数
就像平方根函数起作用(sqrt(25)等于5)一样, 你也可以声明自己的函数。例如,
// Create instance of MathCalcvar calc = new MathCalc(); // Your mathematical operationvar expression = 'addNumbers(1 , 3)'; // Evaluate resultvar parser = calc.parse(expression); // Declare addNumbers function in the parserparser.scope.addNumbers = function(a, b) { return a + b; }; // Check if there's a syntax errorif (parser.error) {console.error('The expression "' + expression + '" has an error', expr.error.text ); // Proceed to solve}else {// The result will be a JS number, not a string// Insert the variables valuevar result = parser.eval(); // Displays 4 as results (as expected) !console.log('The expression "' + expression + '" generates:', result); }

处理运行时错误
如果自定义实现的功能无法按预期工作, 那么你可能不知道在没有正确处理过程的情况下发生了什么。检查范围是否具有runtimeError属性, 以检查自定义函数是否触发了错误:
// Create instance of MathCalcvar calc = new MathCalc(); // Your mathematical operationvar expression = 'functionThatDoesnExist(1 , 3)'; // Evaluate resultvar parser = calc.parse(expression); // Check if there's a syntax errorif (parser.error) {console.error('The expression "' + expression + '" has an error', expr.error.text ); // Proceed to solve}else {// The result will be a JS number, not a string// Insert the variables valuevar result = parser.eval(); if (parser.scope.runtimeError) {alert('Runtime JS Error'); }// Displays 4 as results (as expected) !console.log('The expression "' + expression + '" generates:', result); }

现场例子【如何使用MathCalc在JavaScript中实现基本的数学表达式计算器】以下小提琴实现了脚本的非常基本的实现。输入充当屏幕, 你可以在其中插入表达式以及计算结果的按钮:
编码愉快!

    推荐阅读