如何在Singleton类中创建和事件处理程序 - Javascript

时间:2014-12-07 14:49:26

标签: javascript singleton custom-events

我有下一个代码:

// Singleton
var mySingleton = (function () {
    // Private methods and variables

    function privateMethod(){
        console.log( "I am private" );
    }

    var privateVariable = "Im also private";

   return {
      // Public methods and variables
      hello: function () {
        console.log( "I want to ''fire'' the event 'hello'" );
      }
    };
})();

我想创建自己的事件处理系统。我尝试使用以下代码:

var mySingleton = (function () {

    function privateMethod(){
        console.log( "I am private" );
    }

    var handlers = {};
    mySingleton.prototype.registerHandler = function(event, callback) {
       this.handlers[event] = callback;
    };
    mySingleton.prototype.fire = function(event) {
       this.handlers[event]();
    };

    var privateVariable = "Im also private";

    return {
      hello: function () {
        console.log( "I want to ''fire'' the event 'hello'" );
        fire('hello');
      }
    };

})();

我使用如下:

mySingleton .registerHandler('hello', function () {
    alert('Hi!');
});

但是这不起作用......给我下一个错误:

Cannot read property 'prototype' of undefined

有人可以帮助我吗?

我当前的错误:

Uncaught TypeError: Cannot set property 'mycustomevent' of undefined
Uncaught TypeError: Cannot read property 'mycustomevent' of undefined

2 个答案:

答案 0 :(得分:2)

您的代码正在尝试分配尚不存在的对象的“prototype”属性。反正真的没有意义;只需将这些方法放在您要返回的对象中:

var mySingleton = (function () {

    function privateMethod(){
        console.log( "I am private" );
    }

    var handlers = {};
    var privateVariable = "Im also private";

    return {
      hello: function () {
        console.log( "I want to ''fire'' the event 'hello'" );
        this.fire('hello');
      },
      registerHandler: function(event, callback) {
        handlers[event] = callback;
      },
      fire: function(event) {
        if(handlers[event]){
           handlers[event]();
        }else{
           console.error("Sorry, there aren't any handlers registered with that name");
        }
      }
    };
})();

您正在构建为“mySingleton”的对象只是一个普通对象;也就是说,它是Object构造函数的一个实例。没有涉及新的原型。

您不需要this引用来访问“处理程序”映射,因为它位于事件处理函数的闭包范围内。但是,在使用this API时,确定需要.fire()的方式,但是也可以通过在匿名中本地声明服务功能来解决这个问题。包装

答案 1 :(得分:0)

请尝试以下代码



var singleton = (function(){
    var instance;
    var myObj = function(){
        this.name = "myObj";
        this.eventObj = {};
    };
    var localFn = function(){
        if(!instance){
            instance = new myObj();//singleton, instance created once
        }
        return instance;
    };
  //add 2 functions on myObj
    myObj.prototype.addEvent = function(evName, cb){
        this.eventObj[evName] = cb;
    };
    myObj.prototype.invokeEvent= function(evName){
        this.eventObj[evName]();
    };
    return localFn;
}());

singleton().addEvent("btnClick", function(){alert("click event invoked")});
singleton().addEvent("btnClick_1", function(){alert("click event invoked")});
singleton().invokeEvent("btnClick"); //alert "click event invoked"