JavaScript-使本地变量像全球一样

Question

我正在学习有关本地和全局变量的知识。在此程序中，我的功能可以做2件事。如果您在函数中输入大于0的数字，则它将sets y变量。如果您通过0，则 displays y变量。

function sety(x) {
  if (x>0)  y=x;  else alert(y);
}

<button onclick="sety(222)">SET Y to 222</button>
<button onclick="sety(333)">SET Y to 333</button>
<button onclick="sety(0)">display the Y variable</button>

在此示例中，y是一个全局变量。如果我想创建一个不包含全局变量的程序怎么办？如果我将var y放在功能中，那使其成为本地，对吗？

我也有第二个问题。如果要在设置变量之前单击"显示"按钮，我会遇到错误。我尝试添加if(x=="undefined")，但这仍然给了我一个错误。在这种情况下，我如何防止错误。

Answer 1

创建一个闭合。

(function() {
    var y; // y is now local to this closure
    window.sety = function(x) {
        // however you still want sety() to be a global function,
        // so you have to do this explicitly
        if( x > 0) y = x;
        else alert(y);
    };
})();

我会注意到，有两个函数做两件事通常是一个坏主意 - 尤其是在" set y"之类的名字中。考虑将其分为两个函数sety(x)和gety()，后者返回 而不仅仅是提醒。

Answer 2

您可以将属性添加到功能中并进行更新。

function sety(x) {
    if (x > 0) {
        sety.y = x;
    } else {
        alert(sety.y);
    }
}

<button onclick="sety(222)">SET Y to 222</button>
<button onclick="sety(333)">SET Y to 333</button>
<button onclick="sety(0)">display the Y variable</button>

Answer 3

它说y是不确定的原因，如果您尝试在没有设置的情况下显示变量，则是因为该行y = x的作用类似于var y = x，它定义了变量y。如果您在尝试显示该行之前没有执行该行（如果您尝试先显示它不会），则var y永远不会发生，这会给您带来错误。为了解决这个问题，您必须在其他之前定义y。

下面的摘要将是"本地变量"。从本质上讲，每次执行功能时，它都会重新定义y。

function sety(x) {
  var y;
  if (x > 0) y = x;
  else alert(y);
}

<button onclick="sety(222)">SET Y to 222</button>
<button onclick="sety(333)">SET Y to 333</button>
<button onclick="sety(0)">display the Y variable</button>

下面的摘要仅在未定义时定义y。

function sety(x) {
  if (x > 0) y = x;
  else {
    if (typeof y == 'undefined') {
      var y;
    }
    alert(y);
  }
}

<button onclick="sety(222)">SET Y to 222</button>
<button onclick="sety(333)">SET Y to 333</button>
<button onclick="sety(0)">display the Y variable</button>

现在我不建议使用您使用的代码。下面的摘要是您应该使用的代码。

function sety(x) {
  y = x;
}
function gety() {
  if (typeof y == 'undefined') {
    y = 'undefined';
  }
  alert(y);
}

<button onclick="sety(222)">SET Y to 222</button>
<button onclick="sety(333)">SET Y to 333</button>
<button onclick="gety()">display the Y variable</button>

Answer 4

您可以访问该变量如下：window.y，因为您在执行此y = x时隐式设置为window对象。

这是要克服未定义的变量问题

function sety(x) {
  if (x > 0) y = x;
  else alert(window.y);
}

<button onclick="sety(222)">SET Y to 222</button>
<button onclick="sety(333)">SET Y to 333</button>
<button onclick="sety(0)">display the Y variable</button>