手把手教你写游戏开发最常用到的--事件管理！Cocos Creator

文章结尾有完整代码，可直接复制粘贴到项目中使用。

老样子，先给管理者上一个单例模式

class EventSystem {
    /** 单例模式 */
    public static readonly _Ins: EventSystem = new EventSystem();

}

首先，我们要想监听事件，除了需要事件名字外，还需要谁在监听？监听到后执行什么？那么我们就需要一个字符串索引签名，作用相对于map用来存储事件和需要调用的方法。

interface IEventTarget {
    func: Function; // 监听的对象将调用的方法
    target: any; // 监听的对象
}

class EventSystem {
    ...
    /** 观察者列表 */
    private _observers: { [key: string]: IEventTarget[] };
    constructor(){
        this._observers = {};
    }
}

我们来写监听方法，其实就是往字典里的“怪物死亡事件”，添加玩家实例和获得经验的方法。

/** 监听事件 */
    listen(key: string, callback: Function, target: any){
        // 初始化一个数组
        if (this._observers[key] == null)
            this._observers[key] = [];

        let eventTarget = { func: callback, target: target };
        this._observers[key].push(eventTarget);
    }

现在已经能监听事件了，那我们如何发送一个事件呢？发送事件我们肯定需要一个事件名，如果是怪物死亡是不是还需要携带着数据？比如说怪物的实例？或者是多少经验？我们把data设为可选参数，因为有些事件不一定要携带。用foreach来遍历触发回调函数。

/** 发送事件 */
    send(key: string, data?: {}) {
        // 如果没有人监听就直接返回
        if (this._observers[key] == null)
            return;
        // 遍历所有监听此事件的对象 调用回调方法
        this._observers[key].forEach(function (item: IEventTarget) {
            item.func.call(item.target, data);
        })
    }

那取消监听也很简单了，那就是将满足IEventTarget的移除。

/** 取消监听某个事件 */
    unListen(key: string, target: any, fun:Function) {

        if (this._observers[key] == null)
            return;

        this._observers[key] = this._observers[key].filter(function (eventTarget: IEventTarget) {
            return eventTarget.target != target && eventTarget.func != fun;
        });
    }

/** 取消监听所有事件 */
    unListenAll(key:string, target:any){

        if (this._observers[key] == null)
            return;

        this._observers[key] = this._observers[key].filter(function (eventTarget: IEventTarget) {
            return eventTarget.target != target;
        });
        
    }

完整代码

interface IEventTarget {
    func: Function;
    target: any;
}

class EventSystem {
    /** 单例模式 */
    public static readonly _Ins: EventSystem = new EventSystem();
    /** 观察者列表 */
    private _observers: { [key: string]: IEventTarget[] };
    constructor(){
        this._observers = {};
    }
    /** 监听事件 */
    listen(key: string, callback: Function, target: any){

        if (this._observers[key] == null)
            this._observers[key] = [];
        let eventTarget = { func: callback, target: target };
        this._observers[key].push(eventTarget);
    }

    /** 取消监听某个事件 */
    unListen(key: string, target: any, fun:Function) {

        if (this._observers[key] == null)
            return;

        this._observers[key] = this._observers[key].filter(function (eventTarget: IEventTarget) {
            return eventTarget.target != target && eventTarget.func != fun;
        });
    }

    /** 取消监听所有事件 */
    unListenAll(key:string, target:any){

        if (this._observers[key] == null)
            return;

        this._observers[key] = this._observers[key].filter(function (eventTarget: IEventTarget) {
            return eventTarget.target != target;
        });
        
    }

    /** 发送事件 */
    send(key: string, data?: {}) {

        if (this._observers[key] == null)
            return;

        this._observers[key].forEach(function (item: IEventTarget) {
            item.func.call(item.target, data);
        })
    }

}

export const EventMgr = EventSystem._Ins;

使用方法

使用情景：当怪物死亡时，玩家获得经验。

我们在怪物脚本上面检测到HP少于0时，我们发送怪物死亡事件并携带10点经验值。

随后我们回到玩家脚本，监听怪物死亡事件。

当然'MONSTER_DIE'这种字符串我们可以用配置来代替，这样会防止我们防拼写错误。