转载请注明预见才能遇见的博客：https://my.csdn.net/
原文地址：https://blog.csdn.net/weixin_42787326/article/details/81316413
JavaScript Array对象详解
目录
案例9:提示用户输入班级人数,求总成绩,平均值,最高分,最低分---扩展
1..concat(数组,数组,数组,...) 组合一个新的数组
2..push(值);--->把值追加到数组中,加到最后了---返回值也是追加数据之后的数组长度
3..unshift();--->向数组的第一个元素前面插入一个新的元素,----返回值是插入后的长度
4..indexOf(元素值);返回的是索引,没有则是-1==分割==
.splice(开始的位置,要删除的个数,替换的元素的值);一般是用于删除数组中的元素,或者是替换元素,或者是插入元素
5..join("字符串");----返回的是一个字符串 搭配字符串的split使用
6..map(函数);--->数组中的每个元素都要执行这个函数,把执行后的结果重新的全部的放在一个新的数组中
7..forEach(函数)方法---遍历数组用---相当于for循环
9..sort();---排序的,可能不稳定,如果不稳定,请写MDN中的那个固定的代码
10..arr.slice(开始的索引,结束的索引);把截取的数组的值放在一个新的数组中,但是不包含结束的索引对应的元素值
11..pop();--->删除数组中最后一个元素,返回值就是删除的这个值==分割==
.shift();--->删除数组中第一个元素,返回值就是删除的这个值
12..every(函数)--返回值是布尔类型,函数作为参数使用
13.filter(函数);返回的是数组中每一个元素都复合条件的元素,组成了一个新的数组
1.数组的概念和作用
数组:一组有序的数据
数组的作用:可以一次性存储多个数据
* 数组元素:数组中存储的每个数据,都可以叫数组的元素,比如:存储了3个数据,数组中3个元素
* 数组长度:就是数组的元素的个数,比如有3个元素,就说,这个数组的长度是3
* 数组索引(下标):用来存储或者访问数组中的数据的,索引从0开始,到长度减1结束
* 数组的索引和数组的长度的关系:长度减1就是最大的索引值
2.数组的定义:
1. 通过构造函数创建数组 看代码
* 语法:
* var 数组名=new Array();
* var array=new Array();//定义了一个数组
* 数组的名字如果直接输出,那么直接就可以把数组中的数据显示出来,如果没有数据,就看不到数据
* var 数组名=new Array(长度);
* 如果数组中没有数据,但是有长度---,数组中的每个值就是undefined
* 构造函数的方式创建数组的时候,如果在Array(一个数字)--->数组的长度(数组元素的个数)
* 如果在Array(多个值);这个数组中就有数据了,数组的长度就是这些数据的个数var arr1=new Array();//构造函数的方式---空数组
var arr2=new Array(5);//构造函数的方式定义了一个数组,数组中有5个元素,数组长度是5,每个数据是undefined
var arr3=new Array(10,20,1000,40,50,60);
console.log(arr3);2. 通过字面量的方式创建数组
* var 数组名=[];//空数组
* var array=[];看代码
var arr=[10,20,30,40,50,60,70,80,10,20,3043,5];
console.log(arr.length);3.设置和获取数组某个位置的值 看代码
* 如何设置数组中某个位置的值
* 数组名[下标]=值;
* arr[3]=100;
* 如何获取数组中某个位置的值
* var result=数组名[下标];
* console.log(result);var arr=new Array(10,20,30,40,100);
//console.log(arr[4]);//获取
//设置
arr[3]=1000;
console.log(arr);
var arr=[];
//通过索引来设置数组中的元素的值
arr[0]=10;
arr[1]=20;
console.log(arr.length);//2
//获取元素的值,通过索引的方式
console.log(arr[2]);//undefined
4.1-3总结
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;5.for循环遍历数组 看代码
var arr=[10,20,30,40,50,60,70,80,90,100];
//小于的是数组的长度--个数
for(var i=0;i<arr.length;i++){
console.log(arr[i]);
}6.案例
案例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);
案例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);案例10: 冒泡排序
//冒泡排序:把所有的数据按照一定的顺序进行排列(从小到大,从大到下)
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);7.判断某个变量是不是数组
var arr = [];
console.log(Array.isArray(arr));//true
console.log(arr instanceof Array);//true
console.log(typeof arr);//object8.Array常用Api
1..concat(数组,数组,数组,...) 组合一个新的数组
var arr1=[10,20,30];
var arr2=[40,50,60];
var arr3=[70,80,90];
var arr4=[100,110,120];
// [10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120]
console.log(arr1.concat(arr2,arr3,arr4));2..push(值);--->把值追加到数组中,加到最后了---返回值也是追加数据之后的数组长度
var arr=[10,20,30,40,50];
arr.push(function(a,b){return a+b})
//[10, 20, 30, 40, 50, ƒ]3..unshift();--->向数组的第一个元素前面插入一个新的元素,----返回值是插入后的长度
var arr=[10,20,30,40,50];
var result=arr.unshift(100);
console.log(result);//6
console.log(arr);//[100, 10, 20, 30, 40, 50]4..indexOf(元素值);返回的是索引,没有则是-1==分割==
.splice(开始的位置,要删除的个数,替换的元素的值);一般是用于删除数组中的元素,或者是替换元素,或者是插入元素
var arr=[10,20,30,40];
var index=arr.indexOf(300);
console.log(index);//-1var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
// myFish.splice(2, 0, 'drum'); // 在索引为2的位置插入'drum'
// myFish 变为 ["angel", "clown", "drum", "mandarin", "sturgeon"]
myFish.splice(2, 1); // 从索引为2的位置删除一项（也就是'drum'这一项）
//console.log(myFish);
// myFish 变为 ["angel", "clown", "mandarin", "sturgeon"]
自己扩展删除所有的案例
5..join("字符串");----返回的是一个字符串 搭配字符串的split使用
var arr=["小白","小黑","小红","小芳","小绿","小苏"];
var str=arr.join("|");
console.log(str);//小白|小黑|小红|小芳|小绿|小苏
var newArr = str.split('|');
console.log(newArr);//["小白", "小黑", "小红", "小芳", "小绿", "小苏"]6..map(函数);--->数组中的每个元素都要执行这个函数,把执行后的结果重新的全部的放在一个新的数组中
var numbers = [1, 4, 9];
var roots = numbers.map(Math.sqrt);
console.log(roots);//[1, 2, 3]
console.log(numbers);//[1, 4, 9]
numbers.map(function(item,index){
console.log(item+"+++++++"+index);
})7..forEach(函数)方法---遍历数组用---相当于for循环
var arr = [10, 20, 30, 40];
arr.forEach(function (ele,index) {
console.log(ele+'======'+index);
});8..reverse();----->反转数组
var arr=[10,20,30,40,50];
arr.reverse();//反转
console.log(arr);// [50, 40, 30, 20, 10]9..sort();---排序的,可能不稳定,如果不稳定,请写MDN中的那个固定的代码
var arr=[1,40,20,10,100];
//a---arr[j]
//b---arr[j+1]
arr.sort(function (a,b) {
if(a>b){
return 1;
}else if(a==b){
return 0;
}else{
return -1;
}
});
console.log(arr);//[1, 10, 20, 40, 100]10..arr.slice(开始的索引,结束的索引);把截取的数组的值放在一个新的数组中,但是不包含结束的索引对应的元素值
var arr=[10,20,30,40,50,60,70,80,90,100];
var newArr= arr.slice(3,7);
console.log(newArr);//[40, 50, 60, 70]11..pop();--->删除数组中最后一个元素,返回值就是删除的这个值==分割==
.shift();--->删除数组中第一个元素,返回值就是删除的这个值
var arr=[10,20,30,40,50];
console.log(arr.pop());//50
console.log(arr.shift());//10
console.log(arr);//[20, 30, 40]12..every(函数)--返回值是布尔类型,函数作为参数使用
函数中有三个参数,第一个参数是元素的值，第二个参数是索引值,第三个参数是原来的数组(没用)。 如果这个数组中的每个元素的值都符合条件,最后才返回的是true
var arr=[1000,2000,3000];
//a----: 元素的值
//b----: 索引的值
//c----:谁调用了这个方法,那么c就是谁---->arr
var flag= arr.every(function (a,b) {
//console.log(a+"==="+b+"===="+c);
return a>2000;//数组中的每个元素的值都要大于2000的情况,最后才返回true
});
var arr=["小明明lkko","小曹操674","小白白bd","笑眯眯a"];
var flag=arr.every(function (ele,index) {
//数组中的每个元素的长度是不是大于4
return ele.length>4;
});
console.log(flag);13.filter(函数);返回的是数组中每一个元素都复合条件的元素,组成了一个新的数组
var arr=[10,20,30,40,50,60,70,80];
var newArr=arr.filter(function (ele) {//ele---每个元素
return ele>40;
});
console.log(newArr);9.练习
1.将一个字符串数组输出为|分割的形式，比如“刘备|张飞|关羽”。使用两种方式实现
2.将一个字符串数组的元素的顺序进行反转。["a", "b", "c", "d"] -> [ "d","c","b","a"]。使用两种种方式实现。提示：第i个和第length-i-1个进行交换
3.工资的数组[1500, 1200, 2000, 2100, 1800],把工资超过2000的删除
4.["c", "a", "z", "a", "x", "a"]找到数组中每一个a出现的位置
JavaScript Array对象详解
博客地址：https://blog.csdn.net/weixin_42787326/article/details/81316413