【js】数组学习笔记(7-1)

简介: 【js】数组学习笔记(7-1)


什么是数组?

数组是使用单独的变量名来存出一系列的值

//创建数组
        var arr=['javascript',123,2.5,true,'ok'];//定义数组arr

创建数组的方法:

⏺️采用直接量创建数组

//采用直接量创建数组
        var arr1=[];//先创建一个空数组
        var arr2=["js",123,2.5,true,"ok"];//定义和赋值同时进行,创建一个有5个元素的数组

⏺️采用Array类构造函数

//采用Array类的构造函数创建
        var arr1=new Array();
        var arr2=new Array("js",123,2.5,true,"ok");//创建一个有5个元素的数组
        var arr3=new Array(5);//创建一个长度为5的数组

索引下标:简称下标,以数字表示,默认从0开始一次递增,用于识别元素。

值:元素的内容,可以是任意类型的数据,如数值型、字符型、数组、对象等

数组的基本操作有哪些?

1. 获取数组的长度——length属性:使用Array对象的length属性可以获得数组的长度,该属性的值代表了数组中元素的个数。

语法:arrayObj.length

举个🍐:

//length获取数组长度
        var arr1=[10,20,30,40];
        document.write("数组arr1的长度为"+arr1.length+"<br>");
        var arr2=new Array();
        arr2[0]="john";
        arr2[2]="Wendy";
        document.write("数组arr2的长度为"+arr2.length+"<br>");

输出结果如下:

♦️对于下标不连续的数组而言,length表示的是数组所占内存空间的数目,而不仅仅是数组中元素的个数

数组的length属性在创建数组时可以初始化

2.获取数组元素:按元素的下标获取元素值

语法格式:数组名【下标】

一次只能返回一个元素值

3.数组的遍历:一次对每个元素均做一次且做一次访问,遍历数组就是对数组所有元素依次进行访问

一般使用for循环或for…in循环

举个🍐for循环

//使用for循环依次输出数组arr1中的元素
        var arr=[10,20,30,40];
        for(var i=0;i<arr.length;i++){
            document.write(arr[i]+" ");
        }
        //输出10,20,30,40

举个🍐for…in循环

//for...in循环查找数组最大元素功能
        var arr=new Array(5,20,10,8,32,28);
        var max=arr[0];//假设第一个元素是最大值
        for(var i in arr){
            if(arr[i]>max)
            {
                max=arr[i];//如果当前遍历的元素大于max,则将其设置为max
            }
        }
        document.write("最大值为"+max);//最大值为32

✨注意:for…in是以任意顺序遍历一个对象的可枚举属性,因为迭代的顺序是依靠执行环境,所以数组遍历不一定按次序访问元素。

如何添加数组元素?

(1)unshift方法:

✨unshift方法将一个或多个新元素添加数组起始位置(即头部),数组中的原元素自动后移,并返回数组新长度

语法:

举个🍐

var arr=new Array(5,20,10,8,32,28);
        document.write("unshift前arr数组长度为"+arr.length+"<br>");
        document.write("unshift前arr数组元素为:");
        for(var i=0;i<arr.length;i++)
        {
            document.write(arr[i]+" ");
        }
        arr.unshift("hello","world");
        document.write("<br>unshift后数组长度为"+arr.length+"<br>");
        document.write("unshift后数组元素为:");
        for(var i=0;i<arr.length;i++)
        {
            document.write(arr[i]+" ");
        }

输出结果如下:

(2)push方法

push方法将一个或多个新元素添加到数组结尾,并返回数组新长度

语法:

举个🍐

//push添加数组结尾
        var arr=new Array(5,20,10,8,32,28);
        document.write("push前arr数组长度为"+arr.length+"<br>");
        document.write("push前arr数组元素为:");
        for(var i=0;i<arr.length;i++)
        {
            document.write(arr[i]+" ");
        }
        arr.push("hello","world");
        document.write("<br>push后数组长度为"+arr.length+"<br>");
        document.write("push后数组元素为:");
        for(var i=0;i<arr.length;i++)
        {
            document.write(arr[i]+" ");
        }

输出结果如下:

(3)splice方法

splice()方法用于添加或删除数组中的元素,可以在指定位置添加元素

语法:

举个🍐

//splice方法插入数组
        var arr=new Array(5,20,10,8,32,28);
        document.write("splice前arr数组长度为"+arr.length+"<br>");
        document.write("splice前arr数组元素为:");
        for(var i=0;i<arr.length;i++)
        {
            document.write(arr[i]+" ");
        }
        arr.splice(2,0,"hello","world");
        document.write("<br>splice后arr数组长度为"+arr.length+"<br>");
        document.write("splice后arr数组元素为:");
        for(var i=0;i<arr.length;i++)
        {
            document.write(arr[i]+" ");
        }

输出结果显示:

如何删除数组元素?

(1)shift方法

shifit方法将移除最前一个元素并返回该元素值,数组中元素自动前移

语法:array.shift()

举个🍐 使用shift删除arr第一个元素

//shift元素删除第一个数组
        var arr=new Array(5,20,10,8,32,28);
        arr.shift();//输出【20,01,8,32,28】

(2)pop方法

pop()方法用于删除数组的最后一个元素并返回删除的元素

语法:array.pop()

//pop用于删除最后一个元素,并返回删除的元素
        var arr=new Array(5,20,10,8,32,28);
        arr.pop();

(3)splice方法

splice方法将删除从指定位置deletePos(删除开始的位置)开始的指定数量deleteCount(删除元素的个数)的元素,数组形式返回所移除元素

语法:arry.splice(deletepos,deleteCount)

举个🍐从数组arr中第二个元素开始删除,共删除两个元素

//splice方法从指定数组中删除两个元素
        var arr=new Array(5,20,10,8,32,28);
        arr.splice(1,2);//输出【5,8,32,28】

数组案例-1

举个🍐计算输入的日期是第几天

//数组案例-就算输入日期是第几天
        //使用一维数组判断这一天是当年是第几天并打印
        var daterArr=new Array(31,28,31,30,31,30,31,31,30,31,30,31);
        //输入年月日
        var year=Number(prompt('请输入年份'));
        var month=Number(prompt('请输入月份'));
        var day=Number(prompt('请输入日'));
        var totalDay=0;
        for(var i=0;i<month-1;i++){
            totalDay+=daterArr[i];
        }
        totalDay+=day;
        //判断是否是闰年
        if(month>2&&(year%4==0&&year%100!=0 || year%400==0)){
            totalDay++;
        }document.write('输入的日期是当年日'+totalDay+'天');

输出结果如下:

数组案例-2

举个🍐 计算平均分与总分

//计算平均分与总分
        //提示用户输入学生的人数以及每个学生的考试成绩并打印出来
        //计算该班级的总分和平均分并打印出来
        var num=Number(prompt('请输入学生人数'));
        var score=[];
        for(var i=0;i<num;i++){
            score[i]=prompt('请输入第'+(i+1)+'个学生成绩,范围在0-100之间');
        }
        //计算总分和平均分
        var sum=0;
        for(var i=0;i<score.length;i++){
            document.write('学生成绩'+(i+1)+':'+score[i]+'<br>');
            sum=sum+Number(score[i]);
        }
        //输出
        document.write('总分为:',sum+'<br>');
        document.write('平均分:',(sum/num).toFixed(2));

输出结果如下:


目录
相关文章
|
2天前
|
存储 JavaScript 索引
js开发:请解释什么是ES6的Map和Set,以及它们与普通对象和数组的区别。
ES6引入了Map和Set数据结构。Map的键可以是任意类型且有序,与对象的字符串或符号键不同;Set存储唯一值,无重复。两者皆可迭代,支持for...of循环。Map有get、set、has、delete等方法,Set有add、delete、has方法。示例展示了Map和Set的基本操作。
23 3
|
2天前
|
存储 JavaScript 索引
JS中数组的相关方法介绍
JS中数组的相关方法介绍
|
2天前
|
JavaScript Java
JS有趣的灵魂 清空数组
JS有趣的灵魂 清空数组
|
2天前
|
JavaScript
通过使用online表单的获取使用,了解vue.js数组的常用操作
通过使用online表单的获取使用,了解vue.js数组的常用操作
|
2天前
|
存储 JavaScript 前端开发
深入了解JavaScript中的indexOf()方法:实现数组元素的搜索和索引获取
深入了解JavaScript中的indexOf()方法:实现数组元素的搜索和索引获取
9 0
|
2天前
|
JavaScript 前端开发
js关于数组的方法
js关于数组的方法
11 0
|
2天前
|
JavaScript 前端开发
js怎么清空数组?
js怎么清空数组?
14 0
|
2天前
|
存储 JavaScript 前端开发
js处理数组的方法
js处理数组的方法
14 2
|
2天前
|
JavaScript 前端开发 索引
JavaScript 数组的索引方法数组转换为字符串方法
JavaScript 数组的索引方法数组转换为字符串方法
|
2天前
|
JavaScript 前端开发
JavaScript 数组的添加删除和排序
JavaScript 数组的添加删除和排序