Question

我正在设计自己的JavaScript计算器，其HTML值如下所示：

        <input type="button" class="button gray" 
        value="tan" onclick='tan()'>

        <input type="button" class="button black" value="3" 
        onclick='v("3")'>

JavaScript代码看起来像这样：

    function tan() {
      var getValue = document.getElementById("d").value;
      document.getElementById("d").value=Math.tan(getValue);
     }

     function v(val) {
         document.getElementById("d").value+=val;
      }

ID“d”表示输入按下按钮的值的屏幕。

我遇到麻烦的是使用Math.pow（a，b）函数按钮。按下值为x ^ y的按钮后，我希望采取以下步骤：

从元素“d”
从下一个按钮中取出值，并将其作为Math.pow（）函数中的第二个值输入。

我已经完成了第一步，我还没弄明白第二步。我设想的JavaScript代码是这样的：

   function power() {
   var getValue = document.getElementById("d").value;
       ......   
       ......
       var powerTotal = Math.pow(getValue,nextValue);
       document.getElementById("d").value = powerTotal;
      }

（getValue是初始值，nextValue是按下电源按钮后按下的下一个按钮的值）

提前感谢您的帮助!!!

Answer 1

这是一个潜在的解决方案：

首先，我不确定你的代码是如何组织的，但我会将所有内容保存在某种名称空间下以防止混乱。之后，我将拥有映射到每个操作的方法（在return语句中，那些是可以调用的“公共”方法），并且还将传递到计算器中的参数存储在数组中。

var Calculator = (function() {
    var _args = [];
    var _operation = '';

    return {
        store: function(val) {
            _args.push(val);
        },

        setOperation: function(op) {
            _operation = op;
        },

        operations: {
            pow: function() {
                return Math.pow(_args[0], _args[1]);
            },

            equals: function() {
                return this.operations[_operation].apply(this);
            }
        }
    };
}());

这就是魔术发生的地方。在window.onload事件（vanilla JS等同于jQuery的document.ready）中，获取输入元素和按钮，并将事件绑定到它们以获取所需的数据。您可以使用onblur获取输入值，因为当您单击每个按钮时会触发该输入值（由于该字段失去焦点）。单击操作按钮时，存储将要使用的操作字符串，并且还会映射到您的“公共”方法之一。单击equals时，可以调用equals方法，该方法使用Function.prototype.apply()进行一些精美的JS元编程来调用正确的函数。

window.onload = function() {
    var inputField = document.getElementById('d');
    var equalsButton = document.getElementById('equals-btn');
    var powButton = document.getElementById('pow-btn');

    inputField.onblur = function() {
        Calculator.store(this.value);
    };

    powButton.onclick = function() {
        Calculator.setOperation('pow');
    };

    equalsButton.onclick = function() {
        // sets the original field to the answer like a real calculator would
        inputField.text = Calculator.operations.equals();
    };
};

这一切都是我头脑中所写的，所以有一个很好的机会我搞砸了，所以更像是伪代码而不是具体的解决方案。要记住的重要一点是存储按顺序输入的数据的方法，以及在数据输入期间（存储操作）在给定点存储状态。

希望这有点帮助。

使用JavaScript计算器计算Math.power函数

1 个答案: