3.4  处理数组

在这个示例中，我们要介绍另一个有用的JavaScript对象，数组（array）。数组是一种可以存储一组信息的变量。与变量一样，数组可以包含任何类型的数据：文本字符串、数字、其他JavaScript对象。在声明数组时，将数组的元素放在圆括号中，以逗号分隔，如下所示：

var newCars = new Array("Toyota","Honda","Nissan");

在此之后，newCars数组就包含这三个表示汽车制造商的文本字符串。要访问数组的内容，应该使用变量名和数组成员的索引号（index number），索引号要放在方括号中。newCars[2]返回"Nissan"，因为与JavaScript中的大多数编号一样，数组编号是从零开始的。

在这个示例中（脚本3-6），我们开始确保Bingo卡片是有效的。在真实的Bingo卡片上，每列具有不同的数字范围：B列是1～15，I列是16～30，N列是31～45，G列是46～60，O列是61～75。如果再看看图3-1，就会发现它不是有效的卡片，因为生成它的脚本仅仅是将1～75之间的随机数简单地放在每个格子里。这个示例只用两行新代码纠正这个问题。完成之后，卡片会像图3-4这样。它仍然不是有效的Bingo卡片（注意，一些列中有重复的数字），但是已经比较接近了。

脚本3-6  这个脚本限制了每一列中值的范围

window.onload = newCard;

function newCard() {

   if (document.getElementById) {

     for (var i=0; i<24; i++) {

       setSquare(i);

     }

   }

   else {

     alert("Sorry, your browser doesn’t support this script");

   }

}

function setSquare(thisSquare) {

   var currSquare = "square" + thisSquare;

   var colPlace = new Array(0,1,2,3,4,0,1,2,3, 4,0,1,3,4,0,1,2,3,4,0,1,2,3,4);

   var newNum = (colPlace[thisSquare] * 15) + Math.floor(Math.random() * 15) + 1;

   document.getElementById(currSquare).innerHTML = newNum;

}

图3-4  这个Bingo卡片已经有所改进，但是仍然不完全有效，因为一些列中有重复的数字

使用数组的步骤如下：

(1) var colPlace = new Array(0,1,2,3,4,0,1,2,3,4,0,1,3,4,0,1,2,3,4,0,1,2,3,4);

我们希望限制哪些随机数可以放在哪一列中。最简单的方法是给每一列分配一个编号（B：0，I：1，N：2，G：3，O：4），然后用以下表达式计算可以放进每一列中的数字：（列号×15）+（1～15的随机数）。

但是，HTML表格是按照行单元格次序布置的，而不是按照列单元格次序；也就是说，先依次经过第一行中的每个单元格，然后是第二行，依此类推；而不是先处理第一列，然后是第二列，依此类推。所以，要用colPlace数组记录每个格子所属的列。它包含0～4的数字并重复五次（要减去空的格子；请注意数组中间的0,1,3,4，这跳过了位置2上的空格子）。

(2) var newNum = (colPlace[thisSquare] * 15) + Math.floor(Math.random() * 15) + 1;

newNum变量仍然生成随机数，但不是1～75的数字，而是计算一个1～15的随机数，然后加上列号（colPlace[thisSquare]）乘15。因此，如果随机数是7，那么它在B列中是7，在I列中是22，在N列中是37，在G列中是52，在O列中是67。