在JavaScript中传递绑定对象方法

对于Firefox扩展，我尝试执行以下操作：

使用两种方法和字段/属性/属性设置对象

其中一个方法必须能够调用另一个方法并访问该属性

我想将该方法注册为事件侦听器

现在，我将其设置为一个类：

var Obj = {
  field: null,
  a: function() { }
  b: function() {
    Obj.field = 'x';
    Obj.a();
  }
}

window.addEventListener('mouseup', Obj.b, false);

但似乎应该可以让mod不“从外部”引用对象（例如，通过使用

Obj

），而只使用

this

。但是，我不知道如何让它正常工作，将一个简单的函数引用传递给

addEventListener（）

，并且（最好）只使用一个名称污染名称空间。可能吗？我试着在谷歌上搜索它，发现，例如，但这似乎并不符合我的清洁设置标准。

使用ES5功能：

var Obj = {
  field: null,
  a: function() { }
  b: function() {
    this.a = 'x';
    this.a();   //Note: not sure what you're trying to do, but calling a string like a function won't work.
  }
}

window.addEventListener('mouseup', Obj.b.bind(Obj), false);

var Obj = {
  field: null,
  a: function() { },
  b: function() {
    this.field = 'x'; // if you overrides `a` you can't call it
    this.a();
  },

  handleEvent: function(event) {
    switch(event.type) {
      case "mouseup":
         this.b();
         break;
    }
  }
}

window.addEventListener('mouseup', Obj, false);

使用ES5功能：

var Obj = {
  field: null,
  a: function() { }
  b: function() {
    this.a = 'x';
    this.a();   //Note: not sure what you're trying to do, but calling a string like a function won't work.
  }
}

window.addEventListener('mouseup', Obj.b.bind(Obj), false);

var Obj = {
  field: null,
  a: function() { },
  b: function() {
    this.field = 'x'; // if you overrides `a` you can't call it
    this.a();
  },

  handleEvent: function(event) {
    switch(event.type) {
      case "mouseup":
         this.b();
         break;
    }
  }
}

window.addEventListener('mouseup', Obj, false);

---

bind

绝对是一个好方法。但是，请注意，

addEventListener

方法可以接受实现接口的对象，而不是函数：

var Obj = {
  field: null,
  a: function() { }
  b: function() {
    this.a = 'x';
    this.a();   //Note: not sure what you're trying to do, but calling a string like a function won't work.
  }
}

window.addEventListener('mouseup', Obj.b.bind(Obj), false);

var Obj = {
  field: null,
  a: function() { },
  b: function() {
    this.field = 'x'; // if you overrides `a` you can't call it
    this.a();
  },

  handleEvent: function(event) {
    switch(event.type) {
      case "mouseup":
         this.b();
         break;
    }
  }
}

window.addEventListener('mouseup', Obj, false);

---

如果您有多个与

Obj

相关的事件，和/或如果您有同一对象的多个实例（不是您的情况），这可能非常有用。

绑定

无疑是一种好方法。但是，请注意，

addEventListener

方法可以接受实现接口的对象，而不是函数：

var Obj = {
  field: null,
  a: function() { }
  b: function() {
    this.a = 'x';
    this.a();   //Note: not sure what you're trying to do, but calling a string like a function won't work.
  }
}

window.addEventListener('mouseup', Obj.b.bind(Obj), false);

var Obj = {
  field: null,
  a: function() { },
  b: function() {
    this.field = 'x'; // if you overrides `a` you can't call it
    this.a();
  },

  handleEvent: function(event) {
    switch(event.type) {
      case "mouseup":
         this.b();
         break;
    }
  }
}

window.addEventListener('mouseup', Obj, false);

---

如果您有多个与

Obj

相关的事件，和/或如果您有同一对象的多个实例（不是您的情况），则此功能非常有用。

JavaScript中的

此

的值非常动态。它是一个调用上下文，这意味着它通常在调用函数时设置，并根据调用方式的不同而有所不同。您可能应该阅读一篇关于

设置此

的各种方法的教程。有些是隐式的，有些是显式的。JavaScript中的

this

的值是非常动态的。它是一个调用上下文，这意味着它通常在调用函数时设置，并根据调用方式的不同而有所不同。您可能应该阅读一篇关于

设置此

的各种方法的教程。有些是隐式的，有些是显式的。