1

我正在尝试创建一个自定义 javascript EventManager 类并添加一些回调函数。但是当回调函数被调用时，函数中的'this'对象是未定义的。我查看了Custom Javascript EventManager - 请帮我完成，但这并不能完全回答我的问题。

为什么 this.onEvent 中 this 和 this.name 未定义？请帮忙，谢谢。

这是我的 jsfiddle：http: //jsfiddle.net/Charissima/fswfv/3/

function arEventManager()   {

    this.callbacks = {};            

    this.addCallback = function(eventCategory, fn) {
        if (!this.callbacks[eventCategory]) {
            this.callbacks[eventCategory] = [];
        }
        if (fn instanceof Function) {
            this.callbacks[eventCategory].push(fn);
        }
        return this;
    }, // addCallback

    this.dispatchEvent = function(eventCategory, params) {
        // Callback-Funktion(en) ausloesen
        for (var iC = 0, lC = this.callbacks[eventCategory].length; iC < lC; iC++) {
            console.log( this.callbacks[eventCategory][iC] );
            this.callbacks[eventCategory][iC](params);
        }
    } // dispatchEvent              
};

function arPerson() {
    this.name;
    this.setName = function(name) {
        this.name = name;
    },
    this.getName = function() {
        return (this.name);
    },
    this.onEvent = function(p2) {
        alert('this.name = ' + this.name + ' / ' + 'p2.name = ' + p2.name);

    }
};


var eventManager = new arEventManager;

var Thomas = new arPerson();    
Thomas.setName('Thomas');

var Mike = new arPerson();  
Mike.setName('Mike');   

eventManager.addCallback("myEvent", Mike.onEvent);

function test() {
    eventManager.dispatchEvent('myEvent', Thomas);
}
4

2 回答 2

1

这是因为您不使用call或apply在调用该函数时，并且在没有上下文的情况下调用它。例如：

  • x.func()调用x.func使得函数内this引用x.

  • var func = x.func; func();x.func没有指定值的调用this。

  • x.func.call(y);调用x.func使得函数内this引用y.

您可以使用 bind 将上下文绑定到函数，您需要 SHIM 以实现浏览器兼容性：

eventManager.addCallback("myEvent", Mike.onEvent.bind(Mike));

更新了 JSFiddle

于 2013-09-18T06:23:50.130 回答
0

将名称变量设为私有？

Javascript (arPerson)

function arPerson() {
    var name;
    this.setName = function(nm) {
        name = nm;
    },
    this.getName = function() {
    return (name);
    },
    this.onEvent = function(p2) {
        alert('this.name = ' + name + ' / ' + 'p2.name = ' + p2.getName());
    }
};
于 2013-09-18T06:53:43.527 回答