数组
为什么要学习数组
之前学习的数据类型,只能存储一个值(比如:Number/String。我们想存储班级中所有学生的姓名,此时该如何存储?
数组的概念
所谓数组,就是将多个元素(通常是同一类型)按一定顺序排列放到一个集合中,那么这个集合我们就称之为数组。
数组的定义
数组是一个有序的列表,可以在数组中存放任意的数据,并且数组的长度可以动态的调整。
通过数组字面量创建数组
// 创建一个空数组
var arr1 = [];
// 创建一个包含3个数值的数组,多个数组项以逗号隔开
var arr2 = [1, 3, 4];
// 创建一个包含2个字符串的数组
var arr3 = ['a', 'c'];
// 可以通过数组的length属性获取数组的长度
console.log(arr3.length);
// 可以设置length属性改变数组中元素的个数
arr3.length = 0;
数组定义代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JavaScript数组</title>
<script>
/*
*
* 数组:存储一组有序的数据
* 数组的作用:一次性存储多个数据
* 数组的定义方式:
* 1.构造函数定义数组: var 数组名=new Array();
* 2.字面量方式定义数组: var 数组名=[];
*
* var 数组名=new Array();空数组
* var 数组名=new Array(值);数组定义了,有长度
* var 数组名=new Array(值1,值2,值3....);定义数组并且有多个数据
* var 数组名=[];空数组
* var 数组名=[值1,值2,值3];有三个数据
* 数组元素:就是数组中存储的数据
* 数组长度:就是数组中元素的个数
* 数组索引(下标):从0开始,到数组的长度减1结束
* 通过下标设置数组的元素值: 数组名[索引]=值
* 通过下标访问数组的元素值: 数组名[索引]
*
*
*
*
* */
var arr1=new Array();//空数组
var arr2=new Array(5);//长度为5的数组,每个数据的值是undefined
var arr3=new Array(1,2,3,4,5);//长度为5分数组,
var arr4=[];//空数组
var arr5=[1,2,3];//长度为3的数组
var arr6=["red","blue","green",1,true];//数组中元素的值的类型可以不一样
var arr7=[];
//设置数组的元素的值
arr7[0]=10;
arr7[1]=20;
</script>
</head>
<body>
</body>
</html>
获取数组元素
数组的取值
// 格式:数组名[下标]下标又称索引
// 功能:获取数组对应下标的那个值,如果下标不存在,则返回undefined。
var arr = ['red',, 'green', 'blue'];
arr[0];// red
arr[2]; // blue
arr[3]; // 这个数组的最大下标为2,因此返回undefined
遍历数组
遍历:遍及所有,对数组的每一个元素都访问一次就叫遍历。
数组遍历的基本语法:
for(var i = 0; i < arr.length; i++) {
// 数组遍历的固定结构
}
数组中新增元素
数组的赋值
// 格式:数组名[下标/索引] = 值;
// 如果下标有对应的值,会把原来的值覆盖,如果下标不存在,会给数组新增一个元素。
var arr = ["red", "green", "blue"];
// 把red替换成了yellow
arr[0] = "yellow";
// 给数组新增加了一个pink的值
arr[3] = "pink";
经典案例
小案例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>$永远的24k纯帅$</title>
<script>
//案例1:求数组中所有元素的和
var arr1 = [10, 20, 30, 40, 50];
var sum = 0;
for (var i = 0; i < arr1.length; i++) {
sum += arr1[i];
}
console.log(sum);
//案例2:求数组中所有元素的平均值
var arr2 = [1, 2, 3, 4, 5];
var sum2 = 0;
for (var i = 0; i < arr2.length; i++) {
sum2 += arr2[i];
}
console.log(sum2 / arr2.length);
//案例3:求数组中所有元素中的最大值
var arr3 = [1, 3, 2, 5, 10, 100, 50];
//假设max变量中存储的是最大值
var max = arr3[0];
for (var i = 0; i < arr3.length; i++) {
//判断这个变量的值和数组中每个元素的值是不是最大值
if (max < arr3[i]) {
max = arr3[i];
}
}
console.log("最大值:" + max);
//一个不好的地方----会出现bug的
// var arr3=[-1,-2,-3];
// //假设max变量中存储的是最大值
// var max=0;
// for(var i=0;i<arr3.length;i++){
// //判断这个变量的值和数组中每个元素的值是不是最大值
// if(max<arr3[i]){
// max=arr3[i];
// }
// }
// console.log("最大值:"+max);
// var arr3=[1,3,2,5,10,100,50];
// //假设max变量中存储的是最大值
// var max=Number.MIN_VALUE;//假设变量是最大的,但是实际上存储的是最小的值
// for(var i=0;i<arr3.length;i++){
// //判断这个变量的值和数组中每个元素的值是不是最大值
// if(max<arr3[i]){
// max=arr3[i];
// }
// }
// console.log("最大值:"+max);
//案例4:求数组中所有元素的最小值
var arr4 = [100, 10, 20, 30, 40, 50];
var min = arr4[0];//假设min里存储的就是最小值
for (var i = 0; i < arr4.length; i++) {
if (min > arr4[i]) {
min = arr4[i];
}
}
console.log("最小值:" + min);
//案例5:倒序遍历数组
var arr5 = [10, 20, 30, 40, 50, 100];
//正序
// for (var i = 0; i < arr5.length; i++) {
// console.log(arr5[i]);
// }
//倒序
for(var i=arr5.length-1;i>=0;i--){
console.log(arr5[i]);
}
//案例6:把数组中每个元素用|拼接到一起产生一个字符串并输出
// var names=["卡卡西","佐助","鸣人","大蛇丸","雏田","小苏","凤姐","黑崎一护"];
// var str="";//空的字符串
// for(var i=0;i<names.length-1;i++){
// str+=names[i]+"|";
// }
//
// console.log(str+names[names.length-1]);
// var names=["卡卡西","佐助","鸣人","大蛇丸","雏田","小苏","凤姐","黑崎一护"];
// var str="";//空的字符串
// for(var i=1;i<names.length;i++){
// str+="|"+names[i];
// }
//
// console.log(names[0]+str);
//案例7:去掉数组中重复的0,把其他的数据放在一个新的数组中
// var arr = [10, 0, 20, 0, 30, 0, 50];
// var newArr=[];//新数组,用来存放第一个数组中所有非0的数字
// for(var i=0;i<arr.length;i++){
// if(arr[i]!=0){
// newArr[newArr.length]=arr[i];
// }
// }
// //把新数组的长度作为下标使用,数组的长度是可以改变的
// console.log(newArr);
//案例8:反转数组---把数组中的数据的位置调换
// var array = [10, 20, 30, 40, 50];
// //循环的目的是控制交换的次数
// for (var i = 0; i < array.length / 2; i++) {
// //先把第一个元素的值放在第三方变量中
// var temp = array[i];
// array[i] = array[array.length - 1 - i];
// array[array.length - 1 - i] = temp;
// }
// console.log(array);
// for(var i=array.length-1;i>=0;i--){
// console.log(array[i]);
// }
//console.log(array);//50 40 30 20 10
//案例9:提示用户输入班级人数,求总成绩,平均值,最高分,最低分---扩展
//提示用户输入人数,并转成数字类型
var perCount = parseInt(prompt("请输入班级人数"));
//定义数组存储班级的每个人的成绩
var perScores = [];
//循环的方式录入每个人的成绩
for (var i = 0; i < perCount; i++) {
//把每个人的成绩存储到数组中
perScores[perScores.length] = parseInt(prompt("请输入第" + (i + 1) + "个人的成绩:"));
}
console.log(perScores);
//求总成绩
var sum = 0;
var avg = 0;//平均值
var max=perScores[0];//最大值
var min=perScores[0];//最小值
for (var i = 0; i < perScores.length; i++) {
sum += perScores[i];//求和
//求最大值
if(max<perScores[i]){
max=perScores[i];
}
//求最小值
if(min>perScores[i]){
min=perScores[i];
}
}
//平均值
avg = sum / perScores.length;
console.log("和为:"+sum);
console.log("平均值:"+avg);
console.log("最大值:"+max);
console.log("最小值:"+min);
</script>
</head>
<body>
</body>
</html>
冒泡排序,从小到大
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>$永远的24k纯帅$</title>
<script>
//冒泡排序:把所有的数据按照一定的顺序进行排列(从小到大,从大到下)
var arr = [10, 0, 100, 20, 60, 30];
//循环控制比较的轮数
for (var i = 0; i < arr.length - 1; i++) {
//控制每一轮的比较的次数
for (var j = 0; j < arr.length - 1 - i; j++) {
if (arr[j] < arr[j + 1]) {
var temp = arr[j];
arr[j] = arr[j + 1];
arr[j + 1] = temp;
}
}
}
console.log(arr);
</script>
</head>
<body>
</body>
</html>