★文章内容学习来源:拉勾教育大前端就业集训营
本篇学习目标:
1.掌握数组的基本语法。
2.掌握数组相关操作:获取/遍历等。
目录
一、概念
1.为什么学习数组?
- 之前学习的数据类型,只能存储一个值(比如:Number/String)。
- 那如果我们想存储班级中所有学生的成绩,此时该如何存储?
2.数组概念
(1) 概念
- 所谓数组(Array),就是将多个元素(通常是同一类型) 按一定顺序排列放到一个集合中,那么这个集合我们就称之为数组。
(2) 注意事项
- 数组是一组有序的数据集合;
- 数组内部可以存放多个数据,不限制数据类型;
- 数组的长度可以动态的调整。
(3) 定义/创建
- 创建数组最简单的方式就是数组字面量方式。
- 数组的字面量:[ ]
- 一般将数组字面量赋值给一个变量,方便后期对数组进行操作。
- 如果存放多个数据,每个数据之间用逗号分隔,最后一个后面不需要加逗号。
//字面量方式创建了一个空数组arr
var arr = [];
//字面量方式创建了一个数组arr1,其中储存着相同数据类型的一组数字
var arr1 = [ 1, 2, 3, 4];
//字面量方式创建了一个数组arr2,其中储存着不同类型的数据
var arr2 = [1, true, 0 , undefined, null ,"haha"];
//在控制台输出
console.log(arr);
console.log(arr1);
console.log(arr2);
二、获取数组元素
1.方法:通过索引值、下标
- 数组可以通过一个
index(索引值、下标)
去获取对应的某一项的数据,进行下一步操作。 index
:从 0 开始,按照整数排序往后顺序排序,例如 0,1,2,3……
// 获取数组arr2中下标为0的项
console.log(arr2[0]); //true
2.使用或者更改数组项的值
- 可以通过index 获取某一项值之后,使用或者更改数组项的值。
- 调用数据:利用数组变量名后面直接加 [index] 方式。
//调用/使用
var a = arr2[4]; //变量名后面直接加 [index]
console.log(a); //null
- 更改数据:arr[index] 调用这一项数据,后面等号赋值更改数据。
//更改数据
arr2[4] = 5;
console.log(arr2[4]);//5
3.注意
- 如果索引值超过了数组最大项数,相当于这一项没有赋值,内部存储的就是
undefined
。
//注意,如果索引值超过数组最大项数
console.log(arr2[6]); //undefined
//最大项数是5,所以只能调用出来undefined
三、数组的长度
1.获取数组长度方法
- 数组有一个
length
的属性,记录的是数组的数据的总长度。 - 使用方法:
变量名.length
//获取数组长度方法
console.log(arr.legth); //undefined
console.log(arr1.length); //4
console.log(arr2.length); //6
2.数组的长度与数组下标关系
- 数组的长度与数组最后一项的下标存在关系,最后一项的下标等于数组的 length-1。
获取最后一项的数据时,可以这样书写:
//获取最后一项数据方法
console.log(arr1[arr1.length-1]); //4
console.log(arr2[arr2.length-1]); //haha
3.改变数组长度
- 数组的长度不是固定不变的,可以发生更改。
(1) 增加
- ①直接给数组length 属性赋一个大于原来长度的值。赋值方式使用等号赋值。
//增长①给数组length属性等号赋值比之前大的数
arr.length = 1;
console.log(arr.length);
console.log(arr);
//增长①给数组length属性等号赋值比之前大的数
arr1.length = 12;
console.log(arr1.length);
console.log(arr1);
- ②或者,可以给一个大于最大下标的项直接赋值,也可以强制拉长数组。
//增长②给大于最大下标的项直接赋值
arr2[10] = "增加一项" ;
console.log(arr2.length);
console.log(arr2);
(2) 缩短
- ①强制给 length 属性赋值,后面数据被会直接删除,删除是不可逆的。
//缩短,强制给length属性赋值,后面数据会被直接删掉,不可逆
arr2.length = 3;
console.log(arr2.length);
console.log(arr2);
四、数组遍历
1.方法
- 遍历:遍及所有,对数组的每一个元素都访问一次就叫遍历。
- 利用 for 循环,将数组中的每一项单独拿出来,进行一些操作。
- 根据下标在
0
到arr.length-1
之间,进行 for 循环遍历。
2.举例
举例1:定义一个数组并且数组遍历。
//定义一个数组
var arr3 = [1,2,3,4,5,6,7,8];
//数组遍历,利用for循环
for (i = 0 ; i <= arr3.length-1 ; i++) {
console.log(arr3[i]);
}
举例2:定义一个数组,并且让这个数组中每项都加5。
//定义一个数组
var arr3 = [1,2,3,4,5,6,7,8];
//给数组中的每个数加5
//遍历的时候限制条件可以利用<= 与 <之间的差距,直接设置 i < arr3.length 即可
for (i = 0 ; i < arr3.length ; i++) {
arr3[i] += 5;
}
console.log(arr3); //输出条件注意是在for循环外的后面的,直接输出最终结果即可
五、案例
求一组数中的所有数的和以及平均值。
//案例:求一组数中的所有数的和以及平均值。
var arr4 = [2,4,6,8,12,14,47] ;
sum = 0;
for (i = 0; i < arr4.length; i++ ) {
sum += arr4[i];
}
console.log("数组arr4中每一项总和为" + sum);
var s = arr4.length ;
var a = sum / s;
console.log("平均值为" + a);
下篇继续:【72】JS(6)——函数①基础