ts中的事件传递

---

在ts中，我们也需要一个通用的事件传递机制，类似于android中的eventBus，当然这个在ts中实现起来是很简单的。

代码如下：
核心类，处理事件的核心/。

/**
 * 观察者
 */

namespace T {

    export class Observer {
        /** 回调函数 */
        private callback: Function = null;
        /** 上下文 */
        private context: any = null;

        constructor(callback: Function, context: any) {
            let self = this;
            self.callback = callback;
            self.context = context;
        }

        /**
         * 发送通知
         * @param args 不定参数
         */
        notify(...args: any[]): void {
            let self = this;
            self.callback.call(self.context, ...args);
        }

        /**
         * 上下文比较
         * @param context 上下文
         */
        compar(context: any): boolean {
            return context == this.context;
        }
    }
}

下面是的整个事件的处理中心。

/**
 * 事件消息处理
 */

namespace T{

    export class EventCenter {
        /** 监听数组 */
        private listeners = {};

        private static instance = null;

        public static getInst(): EventCenter {
            if(!this.instance || this.instance == null) {
                this.instance = new EventCenter();
            }
            return this.instance;
        }
        /** 
         * 注册事件
         * @param name 事件名称
         * @param callback 回调函数
         * @param context 上下文
         */
        public register(name: string, callback: Function, context: any) {
            let observers: Observer[] = this.listeners[name];
            if (!observers) {
                this.listeners[name] = [];
            }
            this.listeners[name].push(new Observer(callback, context));
        }

        /**
         * 移除事件
         * @param name 事件名称
         * @param callback 回调函数
         * @param context 上下文
         */
        public removeListener(name: string, context: any) {
            let observers: Observer[] = this.listeners[name];
            if (!observers) return;
            let length = observers.length;
            for (let i = 0; i < length; i++) {
                let observer = observers[i];
                if (observer.compar(context)) {
                    observers.splice(i, 1);
                    break;
                }
            }
            if (observers.length == 0) {
                delete this.listeners[name];
            }
        }

        /**
         * 发送事件
         * @param name 事件名称
         */
        public fire(name: string, ...args: any[]) {
            let observers: Observer[] = this.listeners[name];
            if (!observers) return;
            let length = observers.length;
            for (let i = 0; i < length; i++) {
                let observer = observers[i];
                observer.notify(name, ...args);
            }
        }
    }
}

使用起来也很简单，使用示例代码如下：
事件的监听

T.EventCenter.getInst().register("test", ()=>{
    //dosomthing()
},this);
// 注意，需要在和removeListener成对使用
T.EventCenter.getInst().removeListener("test",this);

发送消息

T.EventCenter.getInst().fire("test");

打包成js

当然我们可以选择将其打包成js，操作也很简单，在项目的更目录下添加tsconfig.json的ts项目工程配置文件，示例的代码如下:

{
    "compilerOptions": {
        "target": "es5",
        "noImplicitAny": false,
        "lib": [
            "dom",
            "es5",
            "es6",
            "es2015.promise"
        ],

        "removeComments": true,
        "sourceMap": false,
        "declaration": true,
        "outFile": "bin/eventBus.js"
    },
    "include": [
        "src/*.ts",
        "libs/*.d.ts"
    ],
    "exclude": [
        "node_modules",
        "library",
        "local",
        "temp",
        "build",
        "settings"
    ]
}

详情参考官网https://www.tslang.cn/docs/handbook/tsconfig-json.html.