Javascript Google Maps api addDomListener更改此上下文

debugcn 发表于 Dev

达尔文科技

我正在使用GoogleMaps API进行一些工作，并创建了一个模块来保存一些自定义函数：

myFuncs = {
  doStuff: function() {
     console.log('I am doing stuff');
  },
  callStuff: function() {
     console.log('I am calling doStuff');
     this.doStuff();
  }
}

这似乎符合我的需求。但是当我这样做时：

google.maps.event.addDomListener(document.getElementById('myButton'), 'click', myFuncs.callStuff);

单击按钮时，出现以下错误：

Uncaught TypeError: Object #<HTMLButtonElement> has no method 'doStuff'

我在这里了解到，this由于绑定到Dom对象而使的上下文发生了变化，但我不完全了解正在发生的事情或如何解决它。

东沃尔夫

尝试将函数调用包装在匿名函数中。例如：

google.maps.event.addDomListener(document.getElementById('scrollToForm'), 'click', function(){myFuncs.callStuff()});

我只是运行它，它似乎正在工作。

编辑

呼应this当你不使用匿名函数说明你在上下文OPF已经绑定到任何物体。从匿名函数中触发它会将您的上下文设置为要调用的对象。不知道这是否是最好的方法，但是它确实有效。除了使用之外，this您可以显式调出该对象。IE

myFuncs = {
  doStuff: function() {
     console.log('I am doing stuff');
  },
  callStuff: function() {
     console.log('I am calling stuff');
     myFuncs.doStuff();
  }
}

这消除了上下文中的任何混乱。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。