💎一站式轻松地调用各大LLM模型接口,支持GPT4、智谱、豆包、星火、月之暗面及文生图、文生视频 广告
[TOC] # 1.数组的概念 ![](https://img.kancloud.cn/00/40/0040cc145eb74133ca62916f1e761b18_1004x108.png) ~~~ //普通变量次只能存储一个值 var num = 10; //数组- -次可以存储多个值 var arr = [1,2,3,4,5]; ~~~ # 2.1数组的创建方式 JS中创建数组有两种方式: ●利用new创建数组 ~~~ var数组名=new Array () ; var arr = new Array() ; //创建一个新的空数组 ~~~ ![](https://img.kancloud.cn/56/78/5678114277b9c4122b315608ccab704e_692x120.png) ●利用数组字面量创建数组(重点) ~~~ //1.使用数组字面量方式创建空的数组 var 数组名=[]; //2.使用数组字面量方式创建带初始值的数组 var 数组名= ['小白', '小黑','大黄', '瑞奇']; ~~~ ![](https://img.kancloud.cn/8f/d9/8fd96e33aa4a4135d545c4eb1ea23ba1_987x133.png) 2.4数组元素的类型 数组中可以**存放任意类型的数据**,例如字符串,数字,布尔值等。 ~~~ var arrStus = ['小白',12, true,28.9]; ~~~ 3.获取数组元素 ( alert (arrStus \[1\]) ) 3.1数组的索引 ![](https://img.kancloud.cn/47/a0/47a03546c4ca09227ef2f77dcab77f61_1017x352.png) 获取数组使用方法 ~~~ //定义数组 var arrStus = [1,2,3]; //获取数组中的第2个元素 alert (arrStus [1]) ; ~~~ # 4.遍历数组 (重点)(数组内所有元素都点一次) ![](https://img.kancloud.cn/a5/1a/a51a5c99a375b01577bc08aa8abda4a0_829x49.png) ## 遍历数组 使用方法 (for 循环)(重点)获取数组元素 ~~~ //for 循环 初始化为0;自动获取数组长度 for (var i = 0; i < arr.length; i++) { console .1og(arr[i]); } ~~~ ~~~ //遍历数组:就是把数组的元素从头到尾访问一次 vararr=['red',‘green' ,'blue']; for(vari=0;i<3;i++){ console.log(arr[i]); } // 1.因为我们的数组索引号从0开始,所以i必须从0开始 i < 3 // 2.输出的时候arr[i] i计数器当索引号来用 ~~~ 4.1数组的长度 (获取数组数量,数组长度) (**“数组名.length”**) 使用“数组名.length”可以访问数组元素的数量(数组长度)。 ~~~ 控制台输出(数组。长度) console.log(arr.length); ~~~ ![](https://img.kancloud.cn/9c/2a/9c2a85b26aa24cf8b7f4c1dd1ef47b95_1082x398.png) 实验 ## 1、数组求和及平均值 求数组\[2,6,1,7, 4\]里面所有元素的和以及平均值。 ## 案例分析 ①声明一个求和变量sum。 ②遍历这个数组,把里面每个数组元素加到sum里面。 ③用求和变量sum除以数组的长度就可以得到数组的平均值。 代码实验 ![](https://img.kancloud.cn/ca/62/ca62a491c7590815a13b9e0e61b31caa_1063x465.png) ## 2、数组最大值 求数组\[2,6,1,77,52,25,7\]中的最大值。 ## 案例分析 ①声明一个保存最大元素的变量max。 ②默认最大值可以取数组中的第一个元素。 ③遍历这个数组,把里面每个数组元素和max相比较。 ④如果这个数组元素大于max就把这个数组元素存到max里面,否则继续下一轮比较。 ⑤最后输出这个max。 代码实验 ![](https://img.kancloud.cn/d8/cf/d8cfae39670e1ec24f0ecf8923650f92_1105x543.png) ## 3、数组转换为分割字符串 要求:将数组\['red', 'green', 'blue', 'pink'\]转换为字符串,并且用|或其他符号分割 输出: 'redlgreen|bluelpinkl' ## 案例分析 ①需要一个新变量用于存放转换完的字符串str. ②遍历原来的数组,分别把里面数据取出来,加到字符串里面。 ③同时在后面多加一个分隔符。 ![](https://img.kancloud.cn/db/5e/db5e9269736c676e868020dfed0fdf82_1175x457.png) # 5.数组中新增元素 可以通过修改length长度以及索引号增加数组元素 ## 5.1通过修改length长度新增数组元素 ●可以通过修改 length长度来实现数组扩容的目的 ●length 属性是可读写的 ~~~ var arr = ['red', 'green', 'blue', 'pink']; arr. length = 7 ; console. log(arr) ; console. log(arr[4]) ; console. log(arr[5]); console. log(arr[6]) ; ~~~ ![](https://img.kancloud.cn/ab/fc/abfc7345b3f85e54c2b7b9c7cba8c1a7_885x188.png) ![](https://img.kancloud.cn/27/dd/27ddc929d49adac63b64d69ac2bd9443_953x261.png) ## 5.2通过修改数组索引新增数组元素 ●可以通过修改数组索引的方式追加数组元素 ●不能直接给数组名赋值,否则会覆盖掉以前的数据 ![](https://img.kancloud.cn/60/7b/607b041361929ece91801dee04e3d6d7_825x244.png) ### 追加数组元素 (在数组加个新的) ~~~ // 2.新增数组元素修改索引号追加数组元素 var arr1 = [' red','green' ,'blue ']; arr1[3]='pink'; console.log(arr1); ~~~ ![](https://img.kancloud.cn/b1/88/b18883e8d075c0a78983bbd30f6923a4_1013x357.png) ## 实验:数组新增元素 ### **新建**一个数组,里面**存放10**个整数( 1~10 ) ### 案例分析 ①使用循环来追加数组。 ②声明一个空数组arr. ③循环中的计数器i可以作为数组元素存入。 ④由于数组的索引号是从0开始的,因此计数器从0开始更合适,存入的数组元素要+1. 实验代码 ![](https://img.kancloud.cn/c5/e0/c5e0bdc8ec88f1d2630773d8bc9f55bd_1214x395.png) ### 2、**筛选**数组 要求:将数组\[2, 0, 6, 1, 77,0, 52, 0, 25, 7\]中**大于等于10**的元素选出来,放入新数组。 ### 案例分析 ①声明一个新的数组用于存放新数据newArr。 ②遍历原来的旧数组,找出大于等于10的元素。 ③依次追加给新数组newArr. 实验代码 ![](https://img.kancloud.cn/90/49/90492d75a2e463f8237f0803ff79323b_1193x547.png) 方法2 ![](https://img.kancloud.cn/2a/d8/2ad8a44a1592a599b042ea3bdc016ac5_802x371.png) # 数组案例 ## 案例1 :删除指定数组元素 (**判断语句 if != 指定数**) 要求:将数组\[2,0,6, 1, 77, 0, 52, 0, 25, 7\]中的0去掉后,形成一个不包含0的新数组。 ## 案例分析 ①需要一个新数组用于存放筛选之后的数据。 ②遍历原来的数组,把不是0的数据添加到新数组里面(此时要注意采用数组名+索引的格式接收数据)。 ③新数组里面的个数,用length不断累加。 实验代码 ![](https://img.kancloud.cn/32/6a/326a2935a15126edf366ed14a4f1fc3b_1345x468.png) ## 案例2 :翻转数组 (排列顺序调换) 要求将数组\['red', 'green', 'blue', 'pink', 'purple'\]的内容反过来存放。 输出: \['purple', 'pink', 'blue', 'green', 'red'\] ## 案例分析 ![](https://img.kancloud.cn/ed/20/ed208f1d94a2ebe95fdfc71dca1a70d1_939x586.png) 实验代码 ![](https://img.kancloud.cn/d3/d2/d3d20be04902b76113014a09e6e08511_1294x377.png) ## 案例3 :数组排序(冒泡排序) (从小到大或从大到小排序) 我们先复习下如何把2个变量交换数据 ![](https://img.kancloud.cn/bc/e1/bce1f22f991f8a99b2db1376f4eaf620_659x309.png) ## 实验(排序 从大到小 或从小到大) 冒泡排序:是一种算法,把-系列的数据按照一定的页序进行排列显示(从小到大或从大到小)。 例如,我们可以将数组\[5, 4, 3, 2, 1\]中的元素按照从小到大的顺序排序,输出: 1 ,2,3,4,5 ## 案例分析 ![](https://img.kancloud.cn/5c/73/5c733d4f6bf9850952f86aec8363da92_950x484.png) 实验代码 ![](https://img.kancloud.cn/a5/1c/a51c357e2dd9d2e2fb1ef11980eef427_1261x545.png)