Javascript设计模式-16-中介者模式

Javascript 设计模式 - 16 - 中介者模式

简介

中介者模式的作用就是解除对象与对象之间的紧耦合关系,增加一个中介者对象后,所有相关的对象都通过中介者对象来通信,而不是相互引用,所以当一个对象发生改变时,只需要通知中介者对象即可,中介者模式使得网状的多对多关系变成了相对简单的一对多关系

下边例子借用了 《javascript 设计模式与开发实践》

优缺点

  • 中介者模式使得各个对象之间得以解耦,以中介中和对象之间的一对多关系取代了对象之间的网状多对多关系,各个对象只要关注自身的功能实现,对象之间的关系交给中介者实现和维护

  • 最大的缺点是系统中会新增一个中介者对象,因为对象之间交互的复杂性,转移成了中介者对象的复杂性,使得中介者对象经常是巨大的,难以维护的。

    /* ===== 创建玩家 ===== */ 
    function Player(name, teamColor) {
        this.name = name;
        this.teamColor = teamColor;
        this.state = 'alive';
    }

    // 游戏成功
    Player.prototype.win = function () {
        console.log( this.name + ' won ' );
    }

    // 游戏失败
    Player.prototype.lose = function () {
        console.log( this.name + ' lose ' );
    }

    // 玩家死亡
    Player.prototype.die = function () {
        this.state = 'dead'; 
        // 通知中介者
        playerDirector.reciveMessage( 'playerDead', this );
    }

    /* ===== 创建玩家的工厂 ===== */ 
    var playerFactory = function (name, teamColor) {
        var newPlayer = new Player(name, teamColor);

        playerDirector.reciveMessage( 'addPlayer', newPlayer );
        return newPlayer;
    }

    /* ===== 创建游戏平台(中介) ===== */ 
    var playerDirector = (function () {
        // 玩家集合
        var players = {}; 
        // 操作集合
        var operations = {};

        // 增加
        operations.addPlayer = function (player) {
            var teamColor = player.teamColor;

            players[teamColor] = players[teamColor] || [];
            players[teamColor].push(player);
        }

        operations.playerDead = function (player) {
            var teamColor = player.teamColor;
            // 找到玩家所在队伍
            var teamPlayers = players[teamColor];
            var all_dead = true;

            for (var i = 0; i < teamPlayers.length; i++) {
                if (teamPlayers[i].state !== 'dead') {
                    all_dead = false;
                    break;
                }
            }

            // 全部死亡发布结果
            if (all_dead === true) {
                // 本队全部失败
                for (var k = 0; k < teamPlayers.length; k++) {
                    teamPlayers[k].lose();
                }

                // 其他队伍全部成功
                for ( var color in players ){ 
                    if ( color !== teamColor ){ 
                        var otherTeamPlayers = players[ color ]; 
                        for ( var j = 0; j < otherTeamPlayers.length; j++){ 
                            otherTeamPlayers[j].win(); 
                        } 
                    } 
                }
            }
        }

        var reciveMessage = function () {
            var message = Array.prototype.shift.call(arguments);

            operations[ message ].apply( this, arguments );
        }

        return {reciveMessage};
    }())


    // 测试
    // 红队: 
    var player1 = playerFactory( 'AA', 'red' ), 
        player2 = playerFactory( 'BB', 'red' ), 
        player3 = playerFactory( 'CC', 'red' ), 
        player4 = playerFactory( 'DD', 'red' );

    // 蓝队: 
    var player5 = playerFactory( 'aa', 'blue' ), 
        player6 = playerFactory( 'bb', 'blue' ), 
        player7 = playerFactory( 'cc', 'blue' ), 
        player8 = playerFactory( 'dd', 'blue' );

    player1.die(); 
    player2.die();
    player3.die(); 
    player4.die();
    /*
        AA lose 
        BB lose 
        CC lose 
        DD lose 
        aa won 
        bb won 
        cc won 
        dd won 
    */ 

文章列表

  1. javascript设计模式 – 设计原则
  2. JavaScript设计模式–高阶函数
  3. Javascript 设计模式 - 01 - 原型模式
  4. Javascript 设计模式 - 02 - 单例模式
  5. Javascript 设计模式 - 03 - 建造者模式
  6. Javascript 设计模式 - 04 - 工厂模式
  7. Javascript 设计模式 - 05 - 外观模式
  8. Javascript 设计模式 - 06 - 代理模式
  9. Javascript 设计模式 - 07 - 观察者模式(发布订阅模式)
  10. Javascript 设计模式 - 08 - 策略模式
  11. Javascript 设计模式 - 09 - 命令模式
  12. Javascript 设计模式 - 10 - 迭代器模式
  13. Javascript 设计模式 - 11 - 职责链模式
  14. Javascript 设计模式 - 12 - 适配器模式
  15. Javascript 设计模式 - 13 - 模板方法
  16. Javascript 设计模式 - 14 - 组合模式
  17. Javascript 设计模式 - 15 - 享元模式
  18. Javascript 设计模式 - 16 - 中介者模式
  19. Javascript 设计模式 - 17 - 装饰者模式
  20. Javascript 设计模式 - 18 - 状态模式

你可能感兴趣的:(javascript设计模式)