Question

我已经尝试制作这个计算器已经有一段时间了，对我而言，一切看起来都很合适，但无论我多少次查看代码，它都无法正常工作。我为此疯狂！这怎么可能不起作用？点击Calculate后没有任何反应！请帮帮我这个！

这是JavaScript：

function calc() {
    var num1, num2;
    var sign = "+";
    var result;

    function getNum1() {
        num1 = document.getElementById('num1').value;
        return Number(num1);
    }
    function getNum2() {
        num2 = document.getElementById('num2').value;
        return Number(num2);
    }
    function getSign() {
        sign = document.getElementById('sign').value;
        return sign;
    }
    function setResult() {
        document.getElementById('result').value = result;
    }
    function doCalc() {

        var num1 = getNum1();
        var num2 = getNum2();

        if(getSign() == "*") {
            result = num1 * num2; 
        }else if(getSign() == "/") {
            result = num1 / num2;
        }else if(getSign() == "-") {
            result = num1 - num2; 
        }else{
            result = num1 + num2;
        }
        setResult();
    }
}

Answer 1

如果您正在调用doCalc()，则无法访问它，因为它的范围是calc()函数。

如果您正在调用calc()，它不会执行任何操作，因为它永远不会调用doCalc()。

如果您将doCalc()次调用添加到calc()函数的末尾，并且您的calc()函数可以访问，那么它将起作用。

Answer 2

确保您在表单字段中使用.value，在其他所有内容.innerHTML s，span等上使用p。 .innerHTML获取或设置元素的内部。

另外，请确保提交按钮具有onclick的事件处理程序 - 最简单的方法是<input onclick="doCalc();" ... />。

Answer 3

我会尝试解耦calc（）函数。这是一种方法。

var Calculator = {
    "eval" : function(operator, x, y) {
                 switch( operator ) {
                     case "+":
                         return (x + y);
                     case "-":
                         return (x - y);
                 }
             }
}

更好的是，

    var Calculator = {
    "eval" : function(operator) {
                 var args = Array.prototype.slice.call(arguments);
                 args.splice(0,1); // lazy hack to remove the argument for the operator

                 switch( operator ) {
                     case "+":
                         return args.reduce( function(x,y){ return (x + y); } );
                     case "-":
                         return args.reduce( function(x,y){ return (x - y) } );
                 }
             }
}

通过这种方式，它可以更容易地重复使用和测试。

var answer = Calculator.eval( '+', 20, 20, 2 );  // yay, prefix notation

第二种变体使用高阶函数＆＃39; reduce＆＃39;将数组减少为单个值。

以下是有关如何减少工作的步骤。我已经拉出了lambda函数，使事情变得更加清晰。

var arr = [20, 20, 20];
function sum(x, y){ return (x + y); }

function reduceMagic(arr){
    var temp = sum(arr[0], arr[1]);  // temp -> 40
    temp =  sum(temp, arr[2]);       // temp -> 42
    return temp;
}

完成的JavaScript计算器与神秘的缺陷

3 个答案: