JS 实现计算器详解及实例代码(一)(2)

// 计算器的按键事件处理 Calculator.prototype.btnClickHanlder = function (btnText) { if ((btnText >= '0' && btnText <= '9') || btnText == this.dot) { // 数字键处理 // 如果上一个是操作符,则清空当前数字区 if (this.isOperator(this.last)) { this.resSpan.innerText = ''; this.digit = ''; } else if ((btnText == this.dot) && (this.last == this.dot)) { // 如果上一个也是点,则对本次的点按钮不做响应 return; } this.digit += btnText; this.expression += btnText; } else if (this.isOperator(btnText)) { // 操作符处理 // 如果当前表达式为'0',按'=',不给响应 if ((btnText == this.equal) && (this.resDown.innerText == this.zero || this.resDown.innerText == "")) return; // 如果上一个是非'='的操作符则不进行处理 if (!this.isOperator(this.last) && btnText == this.equal) { // '='处理 this.showCurrRes(this.zero, this.expression + btnText); // 计算结果显示在表达式区域 return; } else if (this.isOperator(this.last)) { // 上一个是操作符,此次的操作符不做记录 return; } else { this.expression += btnText; } } this.showCurrRes(this.digit, this.expression); this.last = btnText; };

处理将要显示的表达式和当前输入的数字

// 显示当前结果的触发方法 Calculator.prototype.showCurrRes = function (digit, expression) { if (!expression) return; this.showText(digit, expression); // 1. 没有'=',表示还没有到计算结果的时候,直接退出 if (expression.indexOf(this.equal) == -1) return; // 计算出了结果 this.hasEqual = true; // 2. 处理只按了数字然后直接按了等号的情况,即:'234='则直接返回234 var tmpStr = this.delHeadZero(expression.substr(0, expression.length - 1)); // 去掉最后一个'=' if (!this.hasOperator(tmpStr)) { this.showText(tmpStr, expression + tmpStr); return; } // 3. 处理表达式字符串,且计算出结果 var start = 0; for (var i = 0; i < expression.length; i++) { var c = expression[i]; if (this.isOperator(c)) { // 操作符 this.ops.push(c); // 保存操作符 var numStr = expression.substr(start, i + 1); // 数字字符串 var number = 0; // 浮点数和整型处理 if (numStr.indexOf(this.dot)) { number = parseFloat(numStr); } else { number = parseInt(numStr); } this.allDigits.push(number); // 保存数字 start = i + 1; // 重设数字起始位置,即操作符的下一个字符开始 } } // 用allDigits和ops去计算结果 var res = this.calResult(); // 保存此次计算结果,作为下一次计算用 [TODO] this.lastRes = res; // 将结果显示出来 this.showText(res + '', expression + res); };

将处理结果显示到屏显区

// 将表达式和计算结果显示到屏显区 Calculator.prototype.showText = function (digitStr, expression) { // 先删除开头的'0' var expStr = this.delHeadZero(expression); var digStr = this.delHeadZero(digitStr); // 然后再根据情况决定是否添加'0' var tmp = expression == this.zero ? expression : this.addZero(expStr);; var dig = digitStr == this.zero ? digitStr : this.addZero(digStr); this.resSpan.innerText = dig; // 如果表达式第一个是操作符,则表示之前按的是'0',则给补上'0',因为前面将开头的'0'都删掉了 if (this.isOperator(tmp[0])) { tmp = this.zero + tmp; } this.resDown.innerText = tmp; }

计算结果函数

// 计算结果 Calculator.prototype.calResult = function () { var first = 0; var second = 0; var res = 0; for (var i = 0; i < this.ops.length; i++) { first = this.allDigits[i]; second = this.allDigits[i + 1]; switch (this.ops[i]) { case '+': res = first + second; break; case '-': res = first - second; break; case '×': res = first * second; break; case '÷': res = first / second; break; default: break; } this.allDigits[i + 1] = res; } return res; };

清空数据

// 计算完一次,清空所有数据,以备下次计算使用 Calculator.prototype.clearData = function () { this.allDigits = []; this.ops = []; this.expression = this.zero; this.digit = ''; this.resSpan.innerText = this.zero; this.resDown.innerText = this.zero; };

辅助函数

处理表达式开头的'0'问题(第一个按钮是0键或者第一个是小于1的浮点数,表达式需要补零;)

// 开头添加'0',防止重复出现或者没有'0'情况 Calculator.prototype.addZero = function (expression) { if (!expression) return this.zero; if (expression[0] == this.dot) { // 浮点数 return this.zero + expression; } else { return expression; } };

开头去零函数

// 去开头的零 Calculator.prototype.delHeadZero = function (str) { // 先把开头的‘0'都删掉 var tmp = ""; tmp = str.replace(/^[0]+/gi, ""); if (tmp[0] == this.dot) { // 浮点数重新补上'0' tmp = this.zero + tmp; } return tmp; };

判断字符串里是否含有操作符

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wwjypp.html