<!doctype html>

<html lang="en">

<head>

    <title>JavaScript Patterns</title>

    <meta charset="utf-8">

</head>

<body>

<div id="results"></div>

    <script>

        function Player(name) {

            this.points = 0;

            this.name = name;

        }

        Player.prototype.play = function () {

            this.points += 1;

            mediator.played();

        };

        var scoreboard = {

            // 显示内容的容器

            element: document.getElementById('results'),

            // 更新分数显示

            update: function (score) {

                var i, msg = '';

                for (i in score) {

                    if (score.hasOwnProperty(i)) {

                        msg += '<p><strong>' + i + '<\/strong>: ';

                        msg += score[i];

                        msg += '<\/p>';

                    }

                }

                this.element.innerHTML = msg;

            }

        };

        var mediator = {

            // 所有的player

            players: {},

            // 初始化

            setup: function () {

                var players = this.players;

                players.home = new Player('Home');

                players.guest = new Player('Guest');

            },

            // play以后，更新分数

            played: function () {

                var players = this.players,

                    score = {

                        Home: players.home.points,

                        Guest: players.guest.points

                    };

                scoreboard.update(score);

            },

            // 处理用户按键交互

            keypress: function (e) {

                e = e || window.event; // IE

                if (e.which === 49) { // 数字键 "1"

                    mediator.players.home.play();

                    return;

                }

                if (e.which === 48) { // 数字键 "0"

                    mediator.players.guest.play();

                    return;

                }

            }

        };

        // go!

        mediator.setup();

        //window.onkeypress = mediator.keypress;//只兼容标准浏览器
        document.onkeypress = mediator.keypress;//兼容所有浏览器，包括IE
// 30秒以后结束 setTimeout(function () { window.onkeypress = null; console.log('Game over!'); }, 30000); </script> </body> </html>

　　参考引用地址：http://www.cnblogs.com/TomXu/archive/2012/03/13/2374789.html

javascript 中mediator pattern(中介者模式)一个实例demo的更多相关文章

  1. Mediator Pattern --中介者模式原理及实现（C++）

    主要参考<大话设计模式>和<设计模式:可复用面向对象软件的基础>两本书.本文介绍中介者模式的实现. 中介者模式:What it is:Define an object that ...

  2. 在WildFly中运行多个standalone模式的实例

      WildFly作为一款优秀的EJB容器,其前身为JBoss AS.JBoss作为一款开源的应用服务器,被广泛的应用在各种项目当中.假设我们现在有这样一个项目,他是以standalone的模式运行在 ...

  3. ArcGIS API for JavaScript开发环境搭建及第一个实例demo

    原文:ArcGIS API for JavaScript开发环境搭建及第一个实例demo ESRI公司截止到目前已经发布了最新的ArcGIS Server for JavaScript API v3. ...

  4. JavaScript中创建字典对象（dictionary）实例

    这篇文章主要介绍了JavaScript中创建字典对象(dictionary)实例,本文直接给出了实现的源码,并给出了使用示例,需要的朋友可以参考下 对于JavaScript来说,其自身的Array对象 ...

  5. JavaScript中创建对象的几种模式

    代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  6. JavaScript中面向对象的三大特性（一个菜鸟的不正经日常）

    经过几天的学习,把jQuery给啃会了,但是运用的还不算特别熟练,总感觉自己在JavaScript方面的基础十分欠缺,所以继续拾起JavaScript,开始更好的编程之旅~ 今天学的是JavaScri ...

  7. JavaScript中的execCommand()命令详解及实例展示

    execCommand方法是执行一个对当前文档,当前选择或者给出范围的命令.处理Html数据时常用如下格式:document.execCommand(sCommand[,交互方式, 动态参数]) ,其 ...

  8. JavaScript中For循环以及For循环嵌套实例

    JavaScript中For循环实例 1.打印出所有的 "水仙花数 ",所谓 "水仙花数 "是指一个三位数,其各位数字立方和等于该数本身. 例如:153是一个 ...

  9. [VC]在VC++中实现让程序只运行一个实例的方法且实现该实例

    方法一: 有时候在开发应用程序时,希望控制程序运行唯一的实例.例如,最常用的mp3播放软 件Winamp,由于它需要独占计算机中的音频设备,因此该程序只允许自身运行唯一的一个例程.在Visual C+ ...

随机推荐

  1. Android网络开发之HttpURLConnection

    http是一个可靠的传输,建立在TCP/IP连接之上,缺省端口是80,其他端口号也可以用.Android可以用HttpURLConnection或HttpClient接口来开发http程序. http ...

  2. java中写sql语句的小小细节

    来源于:http://www.cnblogs.com/reine98/p/6180472.html 看如下一条sql语句 1 2 3 4 5 6 String sql="SELECT * F ...

  3. 如何在网上隐藏自己的IP地址(转)

    摘自:http://net.yesky.com/396/3082396.shtml 在某些场合(例如论坛发贴时)有些网友希望能隐藏自己的IP地址,以免IP被记下,为安全起见,QQ聊天时也不希望别人知道 ...

  4. nexus 介绍

    http://juvenshun.iteye.com/blog/349534

  5. [转]Splay Tree

    转自:http://blog.sina.com.cn/s/blog_7c4c33190100sg9r.html Splay Tree(又叫伸展树)本质上也是一棵二叉查找树.它不是严格平衡的,但通过一种 ...

  6. javascript高级程序设计第一章

    看后总结: 1.javascript的组成成分:ECMAscript+DOM+BOM

  7. python学习笔记011——内置函数pow()

    1 语法 pow(x, y[, z]) x -- 数值表达式. y -- 数值表达式. z -- 数值表达式. 函数是计算 x 的 y 次方,如果 z 在存在,则再对结果进行取模,其结果等效于pow( ...

  8. XtraTreeList直接显示Access数据库表中的数据

    方法1:点击在拖入的显示控件(TreeList)右上方的箭头,在Treelist任务中选择数据源,添加项目数据源,依次选择数据库.数据集,新建连接,浏览选择数据库(*.mdb),依次点击 下一步,选择 ...

  9. 文件描述符file descriptor与inode的相关知识

    每个进程在Linux内核中都有一个task_struct结构体来维护进程相关的 信息,称为进程描述符(Process Descriptor),而在操作系统理论中称为进程控制块 (PCB,Process ...

  10. 字符串 - KMP模式匹配

    在朴素的模式匹配算法中,主串的pos值(i)是不断地回溯来完成的(见字符串的基本操作中的Index函数).而计算机的大仙们发现这种回溯其实可以是不需要的.既然i值不回溯,也就是不可以变小,那么考虑的变 ...