在ts中，我們也需要一個(gè)通用的事件傳遞機(jī)制，類似于android中的eventBus，當(dāng)然這個(gè)在ts中實(shí)現(xiàn)起來是很簡(jiǎn)單的。

代碼如下：
核心類，處理事件的核心/。

/**
 * 觀察者
 */

namespace T {

    export class Observer {
        /** 回調(diào)函數(shù) */
        private callback: Function = null;
        /** 上下文 */
        private context: any = null;

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

        /**
         * 發(fā)送通知
         * @param args 不定參數(shù)
         */
        notify(...args: any[]): void {
            let self = this;
            self.callback.call(self.context, ...args);
        }

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

下面是的整個(gè)事件的處理中心。

/**
 * 事件消息處理
 */

namespace T{

    export class EventCenter {
        /** 監(jiān)聽數(shù)組 */
        private listeners = {};

        private static instance = null;

        public static getInst(): EventCenter {
            if(!this.instance || this.instance == null) {
                this.instance = new EventCenter();
            }
            return this.instance;
        }
        /** 
         * 注冊(cè)事件
         * @param name 事件名稱
         * @param callback 回調(diào)函數(shù)
         * @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 回調(diào)函數(shù)
         * @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];
            }
        }

        /**
         * 發(fā)送事件
         * @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);
            }
        }
    }
}

使用起來也很簡(jiǎn)單，使用示例代碼如下：
事件的監(jiān)聽

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

發(fā)送消息

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

打包成js

當(dāng)然我們可以選擇將其打包成js，操作也很簡(jiǎn)單，在項(xiàng)目的更目錄下添加tsconfig.json的ts項(xiàng)目工程配置文件，示例的代碼如下:

{
    "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"
    ]
}

詳情參考官網(wǎng)https://www.tslang.cn/docs/handbook/tsconfig-json.html.