推荐用「操作符优先级+双栈法」安全解析数学表达式:先正则清洗并归一化符号,再按优先级计算,特殊处理负数和括号,配合token化与实时校验防错。

直接用 eval() 解析表达式最省事,但不安全;手写解析器又太重。实际项目里推荐用「操作符优先级 + 栈」方式处理输入和计算逻辑,兼顾可控性与健壮性。
如何安全地解析用户输入的数学表达式?
用户可能输 "1+2*3"、"(4+5)/3",甚至带空格或负数。不能直接丢给 eval() —— 它会执行任意代码,比如 "alert(1)" 也能跑。
- 先用正则清洗:去掉多余空格,把
"--"、"+-"等归一化为单个操作符 - 再用「双栈法」:一个存数字,一个存操作符,按优先级决定何时计算(例如
"+"和"-"优先级低于"*"和"/") - 遇到左括号
"("就压栈,遇到右括号")"就持续计算直到弹出对应左括号 - 负数要特殊处理:如果减号出现在开头或左括号后,视为一元负号,不是二元减法
为什么不用 parseFloat() 直接转数字?
parseFloat("1+2*3") 会返回 1,完全忽略后面;parseInt("2.5") 又会截断成 2。它们只适合提取字符串开头的数值,不适合计算器场景。
- 真正需要的是「识别整个合法子表达式」,比如从
"12.5+3.7*2"中切出"12.5"、"3.7"、"2" - 建议用正则
/-?\d+\.?\d*/g提取所有候选数字,再配合上下文判断是否属于数值(比如前面是"+"或"(") - 更稳妥的做法是边扫描边构建 token:数字、操作符、括号各自成类,避免歧义
如何响应按键并更新显示?
监听 click 和 keydown 即可,但要注意退格(Backspace)、清空(Escape)、回车(Enter)这些特殊键。
立即学习“Java免费学习笔记(深入)”;
- 用
dataset属性区分按钮类型:data-type="number"、data-type="operator"、data-type="equals" - 显示区域用
textContent而非innerHTML,防止 XSS(比如用户输入"") - 输入过程中实时校验:如果末尾是操作符,禁止再输入操作符;如果已有小数点,同一数字内不再加第二个
- 按下
Enter应等价于点击=,但需调用相同计算函数,别重复写逻辑
最易被忽略的是错误恢复:比如用户连按 "1++2",解析失败后不能卡死,要清空或回退到上一个合法状态——这比算对结果还影响体验。











