更新javascript计算器的全局变量

时间:2017-09-28 06:06:33

标签: javascript global-variables

我无法弄清楚如何更新我正在处理的javascript计算器的全局变量。我知道使用eval可以使这更容易,但从我在线阅读的内容来看,不建议使用eval。

我的想法是存储第一个数字,直到点击操作。单击后,存储第二个数字,然后查看用户出现的操作,其中“=”或“+ / * - ”执行相应的操作。我还没有完成CE或AC或'。'纽扣呢。如果我无法更新全局变量那么完全没有意义。

在函数本身中,我可以更改变量firstNum和secondNum。 从我在网上看到的,我相信我不是在改变全局变量而是改变变量的本地实例。

我希望能够指出正确的方向来完成这项工作。我试图将数字存储在一个对象中,然后在我需要进行操作时引用该对象,但我不相信自从我收到参考错误后我就这么做了。

提前谢谢。

var theParent = document.querySelector("#container");
var display = document.querySelector("#display");
theParent.addEventListener("click", doSomething, false);
 var reg = new RegExp('^\\d+$');
var result=0;
var symbol='';
var firstNum=0;
var secondNum=0;




 function doSomething(e) {
    if (e.target !== e.currentTarget) {
        var clickedItem = e.target.innerHTML;
        if (reg.test(clickedItem)) {
            if (display.innerHTML==="0"){
               display.innerHTML=clickedItem;
           }
           else {
            display.innerHTML+=clickedItem;
            }
        }   
    }


   if (clickedItem==='='){
    console.log('check firstNum:' +firstNum);
    console.log('check symbol:'+ symbol);
    console.log('operations return: '+ operations(symbol));
        result= operations(symbol);
        console.log('result: '+ result);
        display.innerHTML=result;
        firstNum=result;
        secondNum=0;
        symbol='';
    }

   if (!(reg.test(clickedItem))&&symbol===' '&&clickedItem!=='=')
    {
            symbol=clickedItem;
            display.innerHTML='0';
            console.log('first op '+ symbol);
    }
    if (!(reg.test(clickedItem))&&symbol!==clickedItem&&clickedItem!=='=')  {
        solve(symbol);
        symbol=clickedItem;
        console.log('second op '+symbol);
    }


    if (symbol===''){

        //firstNum = parseInt(display.innerHTML);
        setFirstNum();
        console.log("this firstNum in If: " +firstNum)
    }

    else if (reg.test(clickedItem)){
        setSecondNum();
        console.log("this secondNum in If: " +secondNum)
    }
    else {display.innerHTML='0';}

    e.stopPropagation();
}


function setFirstNum(){
    window.firstNum=parseInt(display.innerHTML);
}

function setSecondNum(){
    window.secondNum=parseInt(display.innerHTML);
}

function operations(symbol){
var operation=[{
  '+':  firstNum + secondNum ,
  '-': firstNum - secondNum  ,
  '÷': firstNum/secondNum ,
  'X':  firstNum*secondNum 
}];
return operation[symbol];
}


function solve(symbol){
    result=operations(symbol);
        display.innerHTML=result;
        firstNum=result;
        secondNum=0;
}

1 个答案:

答案 0 :(得分:0)

您正在引用全局变量,问题在于全局变量theParent。大多数情况下,浏览器在加载文档之前执行javascript,因此无法找到id为#container的任何元素。

为了解决这个问题,您可以声明全局变量,并在加载文档时定义它。

var theParent;

window.onload = function() { 
    theParent = document.querySelector("#container");
    theParent.addEventListener(...);
}

同样适用于显示变量。

希望这有帮助。