javascript - 理解 javascript 中的作用域 - 在两个不同的函数中使用相同的临时元素

Question

我正在开发一个 jQuery 插件，我做了这样的事情:

 function MyPlugin() { ... }

 MyPlugin.prototype = {
     foo: function() { ... },
     bar: function() { ... },
     baz: function() { ... }
 }

现在 foo 函数运行一个循环，调用 bar 函数:

 foo: function() {
     for (i in this.values) {
         var result = this.bar(this.values[i]);
     }
 },


 bar: function(value) {
     var res = '';
     for (i in value) {
         // do something
     }
     return res;
 }

现在请忽略这些函数实际上在做什么，重点是循环本身。我注意到，由于我在 bar 中使用 i - 它更改了 i 的值foo 也是如此。

我读过javascript scoping以前，但这个例子仍然让我感到困惑。为什么 i 会在这样的函数之间滑动？这有什么意义呢？我最终只是使用了不同的变量，但我想知道避免此类问题的正确方法是什么。

提前致谢!

Answer 1

变量不仅在函数之间滑动，而且无处不在。由于您尚未在函数中声明变量，因此您正在使用全局变量。

在每个函数中声明变量，每个函数都会有自己的变量，而不会影响全局范围:

foo: function() {
  for (var i in this.values) {
     var result = this.bar(this.values[i]);
  }
},


bar: function(value) {
  var res = '';
  for (var i in value) {
     // do something
  }
  return res;
}