Javascript 为什么会调用匿名函数，而命名函数不会'；T

我正在创建一个CoffeeScript应用程序，它将网络摄像头视频与画布元素叠加（这只是为了上下文，似乎与我的问题无关）。为了获得覆盖在视频上的正确画布大小，我将事件处理程序函数附加到

loadedmetadata

事件，如下所示：

WebcamWizard.prototype.initializeUserMedia = function(stream) {
  // ...
  video = document.getElementById('webcam');
  video.addEventListener('loadedmetadata', function(e) {
     // ...
     v = e.srcElement;
     // ...
  });
  // ...
}

这很有效。但是，在本例中，我倾向于在特定类的不同方法中定义此处理程序方法，如下所示：

WebcamWizard.prototype.initializeUserMedia = function(stream) {
   // ...
   video = document.getElementById('webcam');
   video.addEventListener('loadedmetadata', this.initializeCanvas);
   // ...
}

WebcamWizard.prototype.initializeCanvas = function(e) {
   // ...
   video = e.srcElement;
   // ...
}

我之所以喜欢这种方式，是因为它使CoffeeScript看起来更整洁，并且允许我更容易地访问我正在使用的类中的canvasdom对象。但是，当我执行第二步时，

initializeCanvas

方法似乎没有被调用。控制台上也没有报告错误。为什么呢

---

奇怪的是，在同一个文件中，以这种方式调用方法的工作方式似乎完全相同。

问题可能是“initializeCanvas”在事件发生后调用时会丢失一个有用的

此

引用。您正在向函数传递一个引用，但是

这个

绑定是短暂的，不会继续存在

您可以将其包装到另一个函数中或使用

.bind（）

：

---

您是否尝试过传递

WebcamWizard.initializeCanvas

而不是

this.initializeCanvas

？很可能您在某个地方遇到异常，这两种调用语义应该无关紧要（除非@jbabey建议，此.initializeCanvas与其原型在运行时存在某种差异）。因此，您可以尝试捕获所有异常：这是正确的答案。它还显示了我对文件部分引用的处理过于草率。今天学习了一些关于JS的新知识！

var wiz = this;
video.addEventListener('loadedmetadata', function() { wiz.initializeCanvas });