JavaScript数组 | 易学教程

1.数组的概念

之前的变量只能存储一个值。如果我们想存储班级中所有学生的姓名，该如何存储呢？

可以使用数组（array）。数组可以把一组相关的数据一起存放，并提供方便的访问方式。

数组就是一组数据的集合，其中每个数据被称为元素，在数组中可以存放仍以类型的元素。数组是一种将一组数据存储在单个变量名下的优雅方式。

//普通变量一次只能存储一个值

var num = 10;

//数组一次可以存储多个值

var arr = [1,2,3,4,5]

2.数组创建

2.1创建数组的方式

JS中创建数组有两种方式：

利用new 创建数组

利用数组字面量创建数组（常用）

数组的字面量是方括号[]

声明数组并赋值成为数组的初始化

这种字面方式也是我们以后最多使用的方式

<script>
        // 1.数组（array）: 就是一组数据的集合，存储在单个变量下的优雅方式 
        // 2.利用new 创建数组
        var arr = new Array(); //创建了一个空的数组。
        // 3.利用数组字面量来创建数组[]
        var arr = [];//创建了一个空的数组
        var arr1 = [1,2,'pink老师',true];
        // 4.我们数组里面的数据一定用 , 分隔
        // 5.数组里面的数据 比如1，2 我们称为数组元素
        
    </script>

2.4数组元素的类型

数组中可以存放任意类型的数据，例如字符串，数字，布尔值等。

var arrStus = ['小白',12,true,28.9];

3.获取数组元素

3.1数组的索引

索引(下标)：用来访问数组元素的序号（数组下标从0开始）

var arr = ['小白', '小黑' , '大黄' , '瑞奇'];

索引号 0 1 2 3

数组是通过索引来访问，设置修改对应的数组元素，我们可以通过 "数组名[索引]"的形式来获取数组中的元素

这里访问就是获取，得到的意思

4.遍历数组

（1）数组每一项怎么取出来？

可以通过“数组名[索引号]”的方式一项一项的取出来

（2）怎么把数组元素全部取出来呢？

循环

遍历，把数组每个元素从头到尾都访问一次（类似于我i们的点名）

// 遍历数组：就是把数组元素从头到尾访问一遍
        var arr = ['red' , 'green' , 'blue']
        for (var i = 0; i < 3; i++)
        {
            console.log(arr[i]);
        }
        // 1.因为我们的数组索引号从0开始，所以i必须从0开始 i<3;
        // 2.输出的是有arr[i] i 计数器当索引号来用

4.1数组的长度

使用"数组名.length"，可以访问数组元素的质量（数组长度）。

<script>
        //数组长度   "数组名.length"
        var arr = ['关羽' , '张飞' , '马超' ,'赵云', '黄忠', '刘备', '姜维']
        for (var i =0 ; arr.length<7; i++)
        {
            console.log(arr[i]);

        }
        console.log(arr.length);     
        //1.数组长度是元素个数 不要跟索引混淆。
        //2. arr.length 动态监测数组元素的个数。 
    </script>

5数组中的新增元素

可以通过修改length长度以及索引号增加数组元素

5.1通过修改length长度新增数组元素

修改length长度实现扩容

length 是可读写的

5.2通过修改数组索引新增数组元素

<script>
        // 1.新增数组元素 修改length长度
        var arr = ['red','green'];
        arr.length = 5;
        console.log(arr);
        console.log(arr[3]);
        // 2.新增数组元素，修改索引号 追加数组元素
        var arr1 = ['red','green'];
        arr1[2] = 'pink';
        // 3,这是替换原来的数组元素
        arr1[0] = 'yellow';
        console.log(arr1);
        //不要直接给数组元素赋值 否贼免得数组元素都没有了
        arr1 = '有点意思';
        console.log(arr1);
    </script>

6.循环添加数组元素

<script>
        var arr = [] ;
        for(var i = 0 ; i<10 ; i++)
        {
            arr[i]=i+1;
        }
        console.log(arr);  
    </script>

7.数组中只保留大于10的元素

<script>
        var arr = [2,0,6,1,77,0,52,0,25,7];
        var data = 10;
        var arrNew = [];
        for(var i=0,j=0 ; i < arr.length ; i++)
        {
            if(arr[i] >= data)
            {
                arrNew[j]=arr[i];
                j++;
            }
        }
        console.log(arrNew);
    </script>

8.把数组元素的特定值去掉（这里去掉的是0）

<script>
        var arr = [2,0,6,1,77,0,52,0,25,7];
        var arr1 = [];
        for(var i=0 ;i<arr.length; i++)
        {
            if(arr[i] != 0)
            {
                arr1[arr1.length] = arr[i];
            }     
        }
        console.log(arr1);
    </script>

9.把数组元素反转

<script>
        //将['red','green','blue','pink','purple']内容反转过来
        var arr = ['red','green','blue','pink','purple','hotpink'];
        var arr1 = [];
        for(var i=(arr.length-1);i>=0;i--)
        {
            arr1[arr1.length] = arr[i];
        }
        console.log(arr1);     
    </script>

来源：oschina

链接：https://my.oschina.net/u/4405012/blog/4294958

标签

RED

Pink

javascript