신비한 결함이있는 자바 스크립트 계산기

Question

나는이 계산기를 얼마 동안 만들려고 노력해 왔지만 나에게 모든 것이 올바르게 보이지만 코드를 몇 번이나 사용했는지에 상관없이 작동하지 않는다. 나는 이것에 미쳤어 요! 어떻게 작동하지 않을 수 있습니까? 계산을 누르면 아무 일도 일어나지 않습니다! 이걸로 나를 도와주세요!

다음은 자바 스크립트 : 그것은이 calc() 함수 내에서 범위가 있기 때문에

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()을 호출하는 경우 절대로 doCalc()을 호출하지 않으므로 아무런 작업도 수행하지 않습니다.

함수 끝에 doCalc() 호출을 추가하고 calc() 함수에 도달 할 수 있으면 작동합니다.

Answer 2

양식 필드에 .value을 사용하고 다른 모든 항목에는 .innerHTML을 사용하십시오 (span, p 등). .innerHTML은 요소 내부를 가져 오거나 설정합니다.

또한 제출 버튼에 onclick의 이벤트 처리기가 있는지 확인하십시오. 가장 쉬운 방법은 <input onclick="doCalc();" ... />입니다.

Answer 3

doCalc() 메서드는 calc 객체 내부에 숨겨져있는 것처럼 보이지 않습니다.

this.performCalculation = function(){ 
     doCalc(); 
    } 

을 한 다음 NUM1, NUM2, 기호의 입력이 당신이 그것을 호출 할 수 있습니다 결과 가정 : 그것을 이런 식으로 뭔가를 추가하려고

new calc().performCalculation(); 

Answer 4

은 내가 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 

두 번째 변형은 고차 함수 'reduce'를 사용하여 배열을 단일 값으로 감소시킵니다.

여기에 reduce 작업 방법이 나와 있습니다. 좀 더 명확하게하기 위해 람다 함수를 꺼 냈습니다.

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; 
}