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>