论基于JavaScript语言的Bingo游戏实现

2011-02-27邓家荣

电脑与电信 2011年5期

邓家荣吴焱

(1.文山学院，云南文山 663000；2.昆明冶金高等专科学校，云南昆明 650033)

1.引言

“Bingo”是一种填写格子的卡片游戏，因游戏中第一个成功者以喊“Bingo”表示取胜而得名。在英美国家有一个说法是：“If you have never played Bingo before，then you are probably in am inority.”[1]。在广泛使用互联网和互联网服务的今天，在网站上进行Bingo游戏也是玩家的新选择。

JavaScript是一种能给网页创建动态的用户界面、控制浏览器、处理表单、设置cookie、即时构建HTML页面以及创建基于Web的应用程序[2]。用JavaScript语言实现Bingo游戏可以更好地让用户体验到网站游戏的魅力。

2.Bingo游戏规则

首先，所有参加游戏的人购买一张或多张Bingo票。一张Bingo票是一张5格x5格的卡片，如图1所示。卡片中的5列分别对应着“B”、“I”、“N”、“G”、“O”5个字母。每张卡片上随机地分布着从1到75的24个号码。卡片上中间那个格为空白区域，称作“Free Space”，可以代表“填充”或“不填充”，依参赛者的意愿而定[1]。

图1 Bingo票示例

“B”列中的号码取自从1到15的数；“I”列中的号码取自从16到30的数；“N”列中的号码取自从31到45的数；“G”列中的号码取自从46到60的数；“O”列中的号码取自从61到75的数。

游戏开始时由叫号员依次随机地选取1到75的号码，并念出来。如念出来的号码出现在游戏玩家自己的Bingo卡片上，参赛者则将该号码所在的格子涂黑（填充）。如果自己的某张卡片上涂黑的格子组成了规定的Bingo图案中的任何一个，则高喊“Bingo”！第一个正确地喊出“Bingo”的参赛者即为获胜者。

不同的游戏比赛场所可以规定不同的Bingo图案，如图2所示为部分典型的Bingo图案。

图2 典型的Bingo图案

3.游戏的算法设计

3.1 卡片界面的实现：

用HTML的＜table>、＜tr>、＜th>、＜td>标签制作出Bingo卡片的框架，并为每个单元格设定id属性，便于在程序中操纵单元格的内容。

3.2 卡片单元格中内容的填写：

使用循环控制语句，将用随机函数生成的从1到75的数字[3]依次填写到卡片中。

3.3 各列不同取数范围的实现：

为各列分配编号，B列为0、I列为1、N列为2、G列为3、O列为4；

设定各列基数为列编号*15，则B列基数为0、I列基数为15、N列基数为30、G列基数为45、O列基数为60；

用随机函数生成从1到15的数字，再加上单元格所在的列基数，就得到符合规则的数字，即B列为1到15的数，I列为16到30的数，N列为31到45的数，G列为46到60的数，O列为61到75的数。

3.4 剔除重复的数字：

多次调用随机函数可能会计算出相同的结果，而卡片中不能出现重复的数字。采用数组[3]记录1到75个数字的使用状态，每计算出一个数字，就在数组中查询其状态，如果已经使用了，就再调用随机函数重新计算一个，如果还没使用过，就将其填入卡片的单元格并在数组中记录下新状态。

3.5 由用户控制新卡片的创建：

当浏览器加载HTML页面时，程序运行生成卡片，同时，还允许用户点击页面上的链接来重新运行程序。这样就可以在浏览器中由用户控制生成卡片，不会产生额外的服务器负载。

3.6 允许用户纠正选错的格子：

首先查明被用户点击的格子，将该单元格的背景色改为红色，表示已经选中该单元格；如果用户点击了红色的单元格，则将单元格背景色恢复为白色，表示取消对该单元格的选择。这里使用预设的CSS样式文件来实现单元格样式的应用。

3.7 检查获胜状态：

检查用户选中的单元格是否构成获胜的Bingo图案，如果确认获胜，则页面闪烁。

获胜图案中被选中的单元格用1标识，空白的单元格用0标识，将单元格从右下角向左上角依次记下其01序列，如图2中获胜图案（a）的编码是：00000000000000000011111，即十进制数31。将用户的图案也用同样的标识代替，用户图案的编码与获胜图案的编码进行按位与运算[3]，结果与获胜图案的编码相同，则可判定用户获胜。