【问题标题】:Closure issue with creating listeners for emitted events为发出的事件创建侦听器的关闭问题
【发布时间】:2013-05-13 08:26:59
【问题描述】:

我已经实现了一个对象,该对象封装了与外部设备交互的驱动程序。当驱动程序接收到数据时,它会发出一个事件。

当我开始时,我会加载所有已定义驱动程序的列表。然后我遍历定义以执行以下操作:

  • 创建一个驱动实例,
  • 监听驱动程序的事件,并
  • 告诉驱动程序连接。

作为已发出事件的侦听器的一部分,我定义了一个函数,该函数传递了有关设备表示的一些详细信息。

但是我的代码似乎有问题。当驱动程序发出事件时,触发的函数仅显示一组详细信息。这些细节是我在创建驱动程序并监听事件的 for 循环中定义的最后一个细节。

我创建了一个测试示例,它通过使用几个简单的对象和一个计时器来重现我的问题。这需要在 node.js 中运行才能看到问题。

var EventEmitter = require('events').EventEmitter;
var util         = require('util');

// define vehicle object
function Vehicle(options) {
    options = options || {};
    this.id = ((options.id != null) ? options.id : -1);
    this.name = ((options.name != null) ? options.name : 'unknown');
}

util.inherits(Driver, EventEmitter);

// define driver object
function Driver(options) {
    options = options || {};
    this.id = ((options.id != null) ? options.id : -1);
    this.name = ((options.name != null) ? options.name : 'unknown');
}

Driver.prototype.startTimer = function(delay) {
    self = this;

    console.log('starting timer for ' + self.name + ' with a delay of ' + delay);

    setTimeout(function() {
        console.log('firing timer for ' + self.name);
        self.emit('timer', 'some data');
    }, delay);
}

// function to create listener
function makeOnTimerFunction(driver, vehicle) {
    console.log("creating function for d name : " + driver.name + ' d id: ' + driver.id + ' v id: ' + vehicle.id + ' v name: ' + vehicle.name);
    return function(d) {
        console.log(" d name: " + driver.name + ' d id: ' + driver.id + ' v id: ' + vehicle.id + ' v name: ' + vehicle.name + ' d: ' + d);
    }
}

var vehicles = new Array();
vehicles.push(new Vehicle({id: 1001, name: 'Max'}));
vehicles.push(new Vehicle({id: 1002, name: 'Cheif'}));
vehicles.push(new Vehicle({id: 1003, name: 'Seigfreid'}));
var driver = null;

for (var i = 0; i < 3; i++) {

    driver = new Driver({
        id: vehicles[i].id,
        name: vehicles[i].name,
    });

    driver.on('timer', makeOnTimerFunction(driver, vehicles[i]));
    driver.startTimer(1000 * i);
}

```

我得到的输出如下:

creating function for d name : Max d id: 1001 v id: 1001 v name: Max
starting timer for Max with a delay of 0
creating function for d name : Cheif d id: 1002 v id: 1002 v name: Cheif
starting timer for Cheif with a delay of 1000
creating function for d name : Seigfreid d id: 1003 v id: 1003 v name: Seigfreid
starting timer for Seigfreid with a delay of 2000
firing timer for Seigfreid
 d name: Seigfreid d id: 1003 v id: 1003 v name: Seigfreid d: some data
firing timer for Seigfreid
 d name: Seigfreid d id: 1003 v id: 1003 v name: Seigfreid d: some data
firing timer for Seigfreid
 d name: Seigfreid d id: 1003 v id: 1003 v name: Seigfreid d: some data

我希望看到如下:

creating function for d name : Max d id: 1001 v id: 1001 v name: Max
starting timer for Max with a delay of 0
creating function for d name : Cheif d id: 1002 v id: 1002 v name: Cheif
starting timer for Cheif with a delay of 1000
creating function for d name : Seigfreid d id: 1003 v id: 1003 v name: Seigfreid
starting timer for Seigfreid with a delay of 2000
firing timer for Max
 d name: Max d id: 1001 v id: 1001 v name: Max d: some data
firing timer for Chief
 d name: Chief d id: 1002 v id: 1002 v name: Chief d: some data
firing timer for Seigfried
 d name: Seigfreid d id: 1003 v id: 1003 v name: Seigfreid d: some data

问题在于计时器始终引用最后一个名为 Seigfreid 的对象。

----编辑----

只是为了澄清问题,问题似乎与makeOnTimerFunction 函数有关。它返回的函数是事件发生时触发的函数。当makeOnTimerFunction 被调用时,变量都是有意义的。但是,当事件触发并调用 makeOnTimerFunction 返回的函数时,变量总是相同的。它们不反映首次调用 makeOnTimerFunction 时的值。

【问题讨论】:

  • 您是否尝试过在最后的for 循环中关闭i
  • 我不确定你的意思 Kieran 抱歉,我已经阅读了一些关于闭包的文章,并认为我可以处理所有变量。

标签: javascript node.js closures eventemitter


【解决方案1】:

这是您的问题:

Driver.prototype.startTimer = function(delay) {
  self = this; <----

您实际上是在创建一个全局变量self,每次运行startTimer 方法时它都会被覆盖。最后,它将被覆盖,因此它指向最后一个驱动程序实例,因此会产生意想不到的结果。

解决方案:使用var 创建一个作用域为方法的新变量:

Driver.prototype.startTimer = function(delay) {
  var self = this;

【讨论】:

  • 谢谢罗伯特,原因有点尴尬,但谢谢你找到它。 :-)
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2012-02-01
  • 1970-01-01
  • 2011-10-27
  • 1970-01-01
  • 2021-10-27
  • 2013-03-15
  • 1970-01-01
相关资源
最近更新 更多