“这个”的问题在 JavaScript 命名空间和事件监听器中

Question

首先，我尝试在我的 JavaScript 程序中使用人造命名空间，如下所示：

// Ish.Com namespace declaration
var Ish = Ish || {};
Ish.Com = Ish.Com || {};

// begin Ish.Com.View namespace
Ish.Com.View = new function() {
  var privateVariable;

  this.publicFunction = function() {
    this.publicFunction2()
  };

  this.publicFunction2 = function() { ... };
};

我并不热衷于使用 this 来调用其他函数，但直到最近，它已经起作用了。不过，我已向某些元素添加了事件侦听器，它们将 this 解释为目标对象。

我知道我可以使用完整的命名空间而不是 this 来调用侦听器内部的函数 (Ish.Com.View.publicFunction2())，但侦听​​器经常调用一个函数，它调用另一个函数，另一个函数。我需要在几乎每个函数调用中使用整个命名空间。

如何让命名空间与事件侦听器良好配合？ 我也对实现命名空间的更好方法感兴趣，因为使用 this.publicFunction2() 很笨拙。

我对最佳实践非常感兴趣，并学习如何用 JavaScript 编写架构良好的应用程序。然而，在我对 JavaScript 有了更彻底的了解之前，框架是不可能的。

Answer 1

看来我今天早上一直以同样的方式回答每个问题:-)

你可以使用“.bind()”：

   var eventHandler = yourObject.someFunction.bind(yourObject);

这将保证 this 每当“eventHandler”时都会引用“yourObject” " 被任何东西调用。

在较新的浏览器中，“bind()”函数位于 Function.prototype 对象上。 Mozilla 文档 包含“bind()”的可靠实现您可以使用它来修补旧版浏览器。

“bind()”的作用是返回一个新函数，该函数显式安排 this 按照您的规定进行绑定。如果您愿意，还可以传递要传入的参数。使用“bind()”的另一种方法是将函数调用包装在您自己的匿名函数中：

  var eventHandler = function() { yourObject.someFunction(); };

Answer 2

我不知道我是否完全理解了你的问题。
这适合您的需求吗？

var obj = new function() {
    var scope = this;

    this.fun1 = function() {
        return scope.fun2();
    }

    this.fun2 = function() {
        //do sth
    }
};

Answer 3

这是由变量上下文和闭包引起的。 “this”始终引用当前对象。事件函数本身就是一个对象，“this”引用该对象。如果您需要引用父对象，可以按照前面所述使用绑定，或者将父对象“this”设置为变量并在事件函数中使用它。

// Ish.Com namespace declaration
var Ish = Ish || {};
Ish.Com = Ish.Com || {};
// begin Ish.Com.View namespace
Ish.Com.View = new function() {
  var privateVariable, thisObj=this;
  this.publicFunction = function() {
    thisObj.publicFunction2()
  };
  this.publicFunction2 = function() { ... };
};