代码改变世界

javascript——Array类型

2013-02-25 17:48  y-z-f  阅读(336)  评论(0编辑  收藏  举报

  今天这节教程不仅仅是阐述ECMAScript3的部分功能,同时也会阐述有关EXMASctip5的很多新的功能

一、创建

      因为它是一个引用类型,自然就需要在使用前先构造它。

      我将分成两种方式来讲述

      I、构造函数

        1.空的Array实例

var colors = new Array();

      

       2.初始化存储数量的Array实例

1 var colors = new Array(20);

      其中的参数"20"创建一个length为20个数组。
     

       3.带数据的Array实例

1 var colors = new Array("red","black","white");

      其中直接将需要存储的数据放在的构造函数中来初始化。

      其实上面的构造函数中都可以省略"new"而是直接使用"var color = Array();" 即可。

    II、字面量表示法

      1.空的Array实例

var color = [];

    

     2.带数据的Array实例

1 var colors = ["red","white","black"];

二、操作

   既然我们已经创造的数组,那么我们就必须要学会如何去使用它。

   下面我从访问数据、修改数据、删除数据和添加数据的方面来阐述。

   I、访问数据

       1.通过索引访问

1 var colors = ["red","black","white"];
2 alert(colors[0]); //弹出"red"
3 alert(colors[3]); //弹出"undefined"

    当我们访问的索引已经超过上限,那么最终返回给我们的值将是"undefined"字符串。

   II、修改数据

      1.通过索引修改

1 var colors = ["red","white","black"];
2 colors[1] = "green";
3 alert(colors[1]) // 返回"green"字符串

  III、删除数据

      1.从后向前将数组删除至指定大小

1 var colors = ["red","black","white"];
2 alert(colors.length) //返回"3" 表示有三个数据
3 colors.length = 1;
4 alert(colors[0]); //返回"red"字符串
5 alert(colors[1]); //返回"undefined"字符串

     这种方法很适合需要在从后向前删除大量数据的时候使用,仅仅是将"length"属性设置为删除后的数组大小即可。

     2.删除指定的数据

1 var colors = ["red","black","white"];
2 colors.splice(0,1);
3 alert(colors.length); // 弹出"2" 表示已经删除了一条数据
4 alert(colors[0]);      // 弹出"black"字符串  因为"red"已经被删除

    这里我们使用"splice"删除指定的数据,其实不仅仅只是删除一条数据。"splice"的第二个参数表示需要删除的数量(如果为零,则可以在指定的数据后面添加数据),第一个参数是数据的索引位置(基于0). 

    3.删除指定的数据并替换为指定的数据

1 var colors = ["red","white","black"];
2 colors.splice(0,1,["green","blue"]);
3 alert(colors.length); //弹出"4"字符串
4 alert(colors[0]);// 弹出"green" 表示第一个数据已经被删除
5 alert(colors[1]); // 弹出"blue" 表示数据添加成功

    这里我们使用了"splice"的第三个参数将我们需要添加的数据放到了第三个参数中。

  IIII、添加数据

       1.追加数据

1 var colors = ["red","white","black"];
2 colors[colors.length] = "green";
3 colors[colors,length] = "blue";
4 alert(colors.length); //弹出"5"字符串
5 alert(colors[4]); //弹出"blue"字符串 表示数据成功追加

     这里估计有人会困惑为什么用"colors,length",其实原理很简单,因为"length"属性永远比当前的最大索引大一,而且javascript又支持这种方式的赋值,自然就可以追加数据了。

1 var colors = ["red","white","black"];
2 colors.concat(["white","blue"]);
3 alert(colors.length); //弹出"5" 表示追加成功

       2.在指定位置添加数据

1 var colors = ["red","black","white"];
2 colors.splice(1,0,["green","blue"]);
3 alert(colors.length); //弹出"5"
4 alert(colors[2]); //弹出"green"字符串

    这里的这种方法前面已经阐述过,再次不在阐述

  三、获得指定数据(进阶)

     I、获得指定范围内的数据

1 var colors = ["red","black","white"];
2 alert(colors.slice(1)); //弹出"black,white" 字符串

     这里的"slice"用来获得指定位置的数据,这里只传递了一个参数,参数是要获得数据的索引。

1 var colors = ["red","black","white"];
2 alert(colors.slice(1,2)); //弹出"black"字符春

    这里使用的两个参数的"slice",读者可能会发现只有弹出了"black"字符串,却没有弹出"white"字符串。因为最后指定的索引"4"是不会显示的。只会显示开始索引的数据到第二个参数指定的索引(不包括

   II、获得指定分隔符数据

1 var colors = ["red","blue","white"];
2 alert(colors.join("|")); //弹出"red|blue|white" 字符串

  四、数据存储方式

     I、栈

1 var colors = ["red","black","white"];
2 colors.push("black"); //压栈
3 alert(colors.pop()); // 弹出"black" 字符串

    II、队列

1 var colors = ["red","black","white"];
2 colors.push("black");
3 alert(colors.shift()); //弹出"red"字符串
1 var colors = ["red","white","black"];
2 colors.unshift("blue");
3 alert(colors.pop()); //弹出"red"字符串

以上只是部分内容,后面将会继续更新