我构建了一个运行良好的简单switch / case语句。按下回车键,将随机抽取每种情况并将其从阵列中移除,直到没有任何残留。

但是,当我单击一个按钮来调用包含相同switch / case语句的函数时,代码将无法正常工作。而不是到达数组的末尾,每次按Enter键都会连续绘制一个随机的情况,而不会结束。

似乎我的阵列在每次按键时都在重置。函数中的代码为何功能不相同?



var casesDrawn = [0, 1, 2];
document.body.addEventListener( 'keyup', function (e) {
  if ( e.keyCode == 13 && casesDrawn.length > 0) {
    randSelect();
  }
  function randSelect(){
    var randNum = Math.floor(Math.random() * casesDrawn.length);
    var num = casesDrawn[randNum];
    casesDrawn.splice(randNum, 1);

    switch (num){
      case 0:
        document.getElementById('show').innerHTML = 'case 0 selected';
        break;
      case 1:
        document.getElementById('show').innerHTML = 'case 1 selected';
        break;
      case 2:
        document.getElementById('show').innerHTML = 'case 2 selected';
        break;
    }
  }
});

function myFunction(){
  var casesDrawn = [0, 1, 2];
  document.body.addEventListener( 'keyup', function (e) {
    if ( e.keyCode == 13 && casesDrawn.length > 0) {
      randSelect();
    }
    function randSelect(){
      var randNum = Math.floor(Math.random() * casesDrawn.length);
      var num = casesDrawn[randNum];
      casesDrawn.splice(randNum, 1);

      switch (num){
        case 0:
          document.getElementById('show').innerHTML = 'case 3 selected';
          break;
        case 1:
          document.getElementById('show').innerHTML = 'case 4 selected';
          break;
        case 2:
          document.getElementById('show').innerHTML = 'case 5 selected';
          break;
      }
    }
  });
}

<p id="show"></p>
<button onclick="myFunction()">Click to jump to Function</button>

    		

最佳答案

每次调用函数时,都会重新定义变量/ array casesDrawn。这不会在函数外部发生,因为“在函数外部声明的变量变为GLOBAL。” W3

但是“在JavaScript函数中声明的变量变成该函数的本地变量。” W3

如果希望变量casesDrawn在不同的函数调用之间保留其值,则有几种选择:


全局定义变量(在函数外部)
使用一个对象(用作类):Static variables in JavaScript
或这里:https://www.quora.com/How-do-you-create-static-variables-in-JavaScript

关于javascript - 代码放在函数中时的行为不同,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/52097206/

10-12 12:19
查看更多