zoukankan      html  css  js  c++  java
  • javascript——Array类型 yz

      今天这节教程不仅仅是阐述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"字符串

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

  • 相关阅读:
    【LeetCode】208.实现Trie(前缀树)(java+c++,两种方法实现,详细图解)
    《java入门第一季》之二维数组
    《java入门第一季》之二维数组
    iOS中UITableView分割线左侧顶齐
    open_links_per_instance 和 open_links 参数说明
    《java第一季之入门篇》的想法
    十四个方法提高博客的页面访问量
    Android中的Message机制
    OC中的枚举类型
    解决ADT大量出现"Unexpected value from nativeGetEnabledTags: 0"的问题
  • 原文地址:https://www.cnblogs.com/yaozhenfa/p/2932469.html
Copyright © 2011-2022 走看看