如何减少Javascript中内部函数变量的范围？

因此，我有以下代码：

var exampleModule = (function() {
  var example = {};

  var self = this;

  example.test = function() {
    this.mousedown = function (e) {
      self.x1 = e.offsetX;
      self.y1 = e.offsetY;
    };

    this.mousemove = function(e) {
      // do something with x1 and y1 and e.offsetX and e.offsetY
    };
  };
})();

我希望将

x1

和

y1

仅限定在example.test中。是否有任何方法可以使用

this

来实现这一点，或者我必须为每个示例执行类似

的操作。test.x1

？目前，它们的范围是整个

exampleModule

，我想将其缩小到

example.test

---

我只是稍微了解一下整个

self/that=this咒语。我知道Javascript有一个bug，当函数中的某个函数中有一个
this
时，它会引用全局作用域，但是当有3个函数时，如上面的例子中所示，该怎么办？当嵌套三个或四个函数时，
这个
等于什么？
您可以使用
示例中已有的中间作用域。test（）
函数并将变量存储在那里：

var exampleModule = (function() {
  var example = {};

  var self = this;

  example.test = function() {
    var x1, y1;
    this.mousedown = function (e) {
      x1 = e.offsetX;
      y1 = e.offsetY;
    };

    this.mousemove = function(e) {
      // do something with x1 and y1 and e.offsetX and e.offsetY
    };
  };
})();

注意：这种设计模式经常充满问题，因为它假设您总是在mousemove之前获得mousedown，但情况显然并非总是如此。因此，您将在mousemove处理程序中仔细编写代码，以确保使用了先前设置的适当值

另外，它看起来不像
示例中的
this
的值。test
可能是您想要的，但您还没有包含足够的代码部分信息，我们无法了解您的意图

Javascript中的此
由函数调用方式设置，并在ES5中的每个函数调用中设置为新值（ES6中的箭头函数除外）。因此，在mousedown处理程序中，它将通过调用此方法的方式进行设置。这里总结了设置此

的各种方式

您可以将已有的中间作用域用于

example.test（）

函数，并将变量存储在其中：

var exampleModule = (function() {
  var example = {};

  var self = this;

  example.test = function() {
    var x1, y1;
    this.mousedown = function (e) {
      x1 = e.offsetX;
      y1 = e.offsetY;
    };

    this.mousemove = function(e) {
      // do something with x1 and y1 and e.offsetX and e.offsetY
    };
  };
})();

注意：这种设计模式经常充满问题，因为它假设您总是在mousemove之前获得mousedown，但情况显然并非总是如此。因此，您将在mousemove处理程序中仔细编写代码，以确保使用了先前设置的适当值

另外，它看起来不像

示例中的
this
的值。test

可能是您想要的，但您还没有包含足够的代码部分信息，我们无法了解您的意图

---

Javascript中的此

由函数调用方式设置，并在ES5中的每个函数调用中设置为新值（ES6中的箭头函数除外）。因此，在mousedown处理程序中，它将通过调用此方法的方式进行设置。这里总结了设置此的各种方式

“我希望x1和y1只在示例中确定作用域。test”这是什么意思？你不希望他们也在

exampleModule

上吗？@t.J.Crowder:正确！ES6解决了本地作用域问题，这以前是Js全局作用域和函数作用域的问题。要使用新功能，只需将每个var关键字替换为关键字let。这意味着您的变量在声明它们的地方起作用，即在声明它们的大括号内。不幸的是，您必须使用babel或类似的浏览器来传输您的代码，因为浏览器不完全支持这一点。babel有多好？我希望我的代码能在尽可能多的系统上运行。“我希望x1和y1只在示例中定义范围。test”这是什么意思？你不希望他们也在

exampleModule

上吗？@t.J.Crowder:正确！ES6解决了本地作用域问题，这以前是Js全局作用域和函数作用域的问题。要使用新功能，只需将每个var关键字替换为关键字let。这意味着您的变量在声明它们的地方起作用，即在声明它们的大括号内。不幸的是，您必须使用babel或类似的浏览器来传输您的代码，因为浏览器不完全支持这一点。babel有多好？我希望我的代码能在尽可能多的系统上运行。好吧，我只是再次尝试了一下（因为我以前试过），但它似乎不起作用。该值在

mousedown

和

mousemove

之间不存在。我也认为这会奏效，但不知道为什么不行。好吧，我想出来了，但解决方案有点超出了问题的范围。它不起作用的原因是，在另一个文件中，我每次都在调用函数的

new

，而不是将其预加载到字典中，因此值不断被重置。好的，所以我只是再次尝试（因为我以前尝试过），但它似乎不起作用。该值在

mousedown

和

mousemove

之间不存在。我也认为这会奏效，但不知道为什么不行。好吧，我想出来了，但解决方案有点超出了问题的范围。它不起作用的原因是，在另一个文件中，我每次都对函数调用

new

，而不是将其预加载到字典中，因此值不断重置。