首页 » JavaScript » Array 类型

Array 类型

除了Object之外,Array类型恐怕是ECMAScript中最常用的类型了。而且,ECMAScript中的数组与其它多数语言中的数组有着相当大的区别。虽然EMCAScript数组与其它语言中的数组都是数据的有序列表,但与其它语言不同的是,ECMAScript数组的每一项可以保存任何类型的数据。也就是说,可以用数组的第一个位置来保存字符串,用第二个位置来保存数值,用第三个位置来保存对象,以此类推。而且,ECMAScript数组的大小是可以动态调整的,即可以随着数据的添加自动增长以容纳新增数据。
创建数组的基本方法有两种方式。第一种是使用Arrray 构造函数,如下面的代码所示:

var colors = new Array();

如果预先知道数组要保存的项目数量,也可以给构造函数传递数量,得到的数组就会具有那么多的位置。例如,下面的代码将创建包含20个项的数组:

var colors = new Array(20);

也可以向Array构造函数传递数组中应该包含的项。以下代码创建了一个包含3个字符串值的数组:

var colors = new Array("red", "blue", "green");

当然,给构造函数传递一个值也可以创建数组。如果传递的是数值,则会按照数值创建包含给定项数的数值;而如果传递的是其他类型的参数,则会创建包含那个值的只有一项的数组。如下:

var colors = new Array(3);      //创建一个包含3项的数组
var names = new Array("Greg");  //创建一个包含1项的数组

另外,在使用Array构造函数也可以省略new操作符。如下面的例子所示,省略new操作符的结果相同:

var colors = Array(3);      //创建一个包含3项的数组
var names = Array("Greg");  //创建一个包含1项的数组

创建数组的第二种基本方式是使用数组字面量表示法。数组字面量由一对包含数组项的方括号表示,多个数组项之间逗号隔开,如下所示:

var colors = ["red", "blue", "green"];  //创建一个包含3个
var names = [];                         //创建一个空数组
var values = [1,2,];                    //不要这样!这样会创建一个包含2或3项的数组
var options = [,,,,,];                  //不要这样!这样创建一个包含5或6项的数组

以上代码的第一行创建了一个包含3个字符串的数组。第二行使用一对空括号创建了一个空数组。第三行展示了在数组字面量的最后一项添加逗号结果:在IE中,values会称为一个包含3个项且每项的值分别为1、2和undefined的数组;在其它浏览器中,values会称为一个包含2项且值分别为1和2的数组。原因是IE的ECMAScript实现在数组字面量方面存在bug。由于这个bug导致的另一种情况如最后一项代码所示,该行代码可能会创建包含5项的数组(在Firefox、Opera、Safari和Chrome中),也可能会创建包含6项的数组(在IE中)。在像这种省略值的情况下,每一项都将获得undefined值;这个结果与调用Array构造函数时传递项数在逻辑上是相同的。但是由于IE的实现与其它浏览器不一致,因此我们强烈建议不使用这种语法。

与对象一样,在使用数组字面量表示法时,也不会调用Array构造函数(Firefox除外)。

在读取和设置数值时,要使用方括号并提供相应值的基于0的数字索引,如下所示:

var colors = ["red", "blue", "green"];
alert(colors[0]);     //显示第一项
colors[2] = "black";  //修改第三项
colors[3] = "brown";  //新增第四项

方括号的索引表示要访问的值。如果索引小于数组中的项数,则返回对应项的值,就像这个例子中的colors[0]会显示“red”一样。设置数组的值也使用相同的语法,但会替换指定位置的值。如果设置某个值的索引超过了数组现有的最大索引值,如果这个例子中的colors[3]所示,数组就会自动增加到该索引值加1的长度(就这个例子而言,索引是3,因此数组的长度就是4)。

数组的项数保存在length属性中,这个属性始终会返回0或更大的值,如下面的之歌例子所示:

var colors = ["red", "blue", "green"];  //创建一个包含3个字符串的数组
var names = [];                         //创建一个空数组
alert(colors.length); //3
alert(names.length) //0

数组的length属性不是只读的。因此,通过设置这个属性,可以从数组的末尾移除项或向数组中添加项。请看下面的例子:

var colors = ["red", "blue", "green"];  //创建一个包含3个字符串的数组
colors.length = 2;
alert(colors[2]);                       //undefined

这个例子中的数组colors一开始有3个值。将其length属性设置为2会移除最后一项,结果在房屋呢colors[2]就会显示undefined了。如果将其length属性设置为大于数组项数的值,则新增的每一项都会取得undefined值,如下所示:

var colors = ["red", "blue", "green"];  //创建一个包含3个字符串的数组
colors.length = 4;
alert(colors[3]);                       //undefined

在此虽然colors数组包含3个项,但它的length属性设置成了4。于是,这个数组中位置为3的那一项就获得了undefined值,数值的项数也增加到4.

利用length属性也可以方便地在数组末尾添加新项,如下所示:

var colors = ["red", "blue", "green"];  //创建一个包含3个字符串的数组
colors[colors.length] = "black";        //(在位置3)添加一种颜色
colors[colors.length] = "brown";        //(在位置4)再添加一种颜色

由于数组最后一项的索引始终是length-1,因此下一个新项的位置就是length。每当在数组末尾添加一项后,其length属性都会自动更新反映这一变化。换句话说,上面例子第二行中的colors[colors.length]为位置3添加了一个值,最有一行colors[colors.length]则为位置4添加了一个值。当把一个值放在超出当前数组大小的位置上时,数组就会重新计算其长度值,即藏毒值等于最后一项索引加1,如下面的例子所示:

var colors = ["red", "blue", "green"];  //创建一个包含3个字符串的数组
colors[99] = "black";                   //(在位置99)添加一种颜色
alert(colors.length);                   //100

在这个例子中,我们像colors数组的位置99插入了一个值,结果数组新长度(length)就是100。而从位置3到位置98的每一项,都将获得undefined值。

数组最多可以包含4294967295个项,这几乎已经能够满足任何编程需求了。如果想添加的项数超过这个上限值,就会发生异常。而创建一个初始大小与这个上限值接近的数组,则可能会导致运行时间超长的脚本错误。

此文章发表在 JavaScript. 将 固定链接 加入收藏.