news 2026/7/2 4:17:54

【黑马程序员JS课程】基础部分——课后测试day03【有答案 可自行练习】

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
【黑马程序员JS课程】基础部分——课后测试day03【有答案 可自行练习】

题目

客观题

(做完会自动批改)

地址:https://ks.wjx.top/vm/eeLxrmN.aspx#

主观题

练习题1:

写一个程序,要求如下(★★)

  • 需求1:让用户输入五个有效年龄(0-100之间),放入数组中

    • 必须输入五个有效年龄年龄,如果是无效年龄,则不能放入数组中
  • 需求2:打印出所有成年人的年龄 (数组筛选)

  • 需求3:打印出所有人总年龄 (累加)

  • 需求4:打印出所有人的平均年龄 (累加)

  • 需求5:打印出最大年龄和最小年龄 (最大值)

练习题2:

找出数组中 元素为10的下标,有则打印该下标,没有则打印-1

  • 例如: [88,20,10,100,50] 打印 2
  • 例如: [88,20,30,100,50] 打印 -1

练习题3:

使用for循环 - 求出数组元素的和 [5, 8, 9, 2, 1, 5]

练习题4:

使用for循环 - 求出数组里大于5的i和 [4, 9, 5, 20, 3, 11]

练习题5:

使用for循环 - 求出班级里同学们平均年龄[15, 19, 21, 33, 18, 24]

练习题6:

计算[2, 6, 18, 15, 40] 中能被3整除的偶数的和

练习题7:

计算[2, 6, 18, 15, 40] 中能被3整除的偶数的个数

练习题8:

给一个数字数组,该数组中有很多数字0,将不为0的数据存入到一个新的数组中

核心练习题

需求:

根据用户输入的个数,页面可以渲染对应王者荣耀永雄的个数

效果如下:

思路分析:

  1. 渲染图片比较多,我们可以把图片地址放入数组中,
  2. 图片名称是有序号排列的,比如1.webp 2.webp 此处可以使用循环方式重复渲染图片
  3. 渲染位置? 可以考虑放到 box盒子里写script 即可

排错题

排错题1

<body><!-- 请问以下代码会出现什么问题,如何解决? --><script>// 需求: 求 1~100之间的累加和// 注意: 此处有3个错误,找出并且修正letsumfor(leti=1;i<100;i++;){sum+=i}console.log(sum)</script></body>

排错题2

<!-- bug:请你找到下面代码的bug,把数字1打印出来 --><body><script>letsum=0letarr=[1,2,3,4,5]for(leti=1;i<arr.length;i++){console.log(arr[i])}</script></body>

排错题3

<!-- bug:找到下面代码死循环的原因,并修改为正确的代码 --><body><script>for(leti=1;i<=5;i++){for(letj=1;j<=5;i++){console.log(`这是双重for循环`);}}</script></body>

答案

主观题

练习题1:

写一个程序,要求如下(★★)

  • 需求1:让用户输入五个有效年龄(0-100之间),放入数组中

    • 必须输入五个有效年龄年龄,如果是无效年龄,则不能放入数组中
  • 需求2:打印出所有成年人的年龄 (数组筛选)

  • 需求3:打印出所有人总年龄 (累加)

  • 需求4:打印出所有人的平均年龄 (累加)

  • 需求5:打印出最大年龄和最小年龄 (最大值)

答案:

/* 1.让用户输入五个有效年龄(0-100之间),放入数组中 *///1.声明累加数组letarr=[]//2.循环遍历while(arr.length<5){//输入年龄letnum=+prompt(`请输入第${arr.length+1}个人有效年龄`)//判断是否有效if(num>0&&num<100){//添加到数组arr.push(num)}}console.log(arr)// 2. 打印输出成人的年龄 年龄 > 18for(leti=0;i<arr.length;i++){if(arr[i]>=18){document.write(`已经成人的年龄是:${arr[i]}<br>`)}}// 需求3:打印出所有人总年龄 (累加)letsum=0for(leti=0;i<arr.length;i++){sum+=arr[i]}document.write(`所有人的年龄是:${sum}<br>`)// 需求4:打印出所有人的平均年龄 (累加)letaverage=0average=sum/arr.length document.write(`所有人的年龄是:${average}<br>`)// 需求5:打印出最大年龄和最小年龄 (最大值) 假设法letmax=arr[0]letmin=arr[0]for(leti=1;i<arr.length;i++){if(max<arr[i]){max=arr[i]}if(min>arr[i]){min=arr[i]}}document.write(`最大值是:${max}<br>`)document.write(`最小值是:${min}<br>`)// 需求5:打印出最大年龄和最小年龄 (最大值) 排序法arr.sort(function(a,b){returna-b;})// 升序letmin=arr[0]//letmax=arr[arr.length-1]// 56

练习题2:

找出数组中 元素为10的下标,有则打印该下标,没有则打印-1

  • 例如: [88,20,10,100,50] 打印 2
  • 例如: [88,20,30,100,50] 打印-1
// 找出数组中 元素为10的下标,有则打印该下标,没有则打印 - 1letarr=[88,20,10,100,50]letre=-1// 用于存储结果,默认没有for(leti=0;i<arr.length;i++){if(arr[i]===10){re=i//如果找到则把当前索引号赋值给 re, 如果没有找到,则默认的是 -1break// 已经找到就退出}}console.log(re)

练习题3:

使用for循环 - 求出数组元素的和 [5, 8, 9, 2, 1, 5]

// 遇到数组 先把遍历写出来!!!!!!!!!!!!!!!=> 访问数组里面的单元的值letarr=[5,8,9,2,1,5]letsum=0for(leti=0;i<arr.length;i++){// sum = sum + itemsum+=item}console.log(sum)// 30

练习题4:

使用for循环 - 求出数组里大于5的i和 [4, 9, 5, 20, 3, 11]

letarr=[4,9,5,20,3,11]for(leti=0;i<arr.length;i++){if(arr[i]>5){sum+=arr[i]}}console.log(sum)

练习题5-8:

(与前面大同小异,故答案略)

核心练习题

需求:

根据用户输入的个数,页面可以渲染对应王者荣耀永雄的个数

思路分析:

  1. 渲染图片比较多,我们可以把图片地址放入数组中,
  2. 图片名称是有序号排列的,比如1.webp 2.webp 此处可以使用循环方式重复渲染图片
  3. 渲染位置? 可以考虑放到 box盒子里写script 即可

答案:

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><metaname="viewport"content="width=device-width, initial-scale=1.0"><title>渲染图片案例</title><style>*{margin:0;padding:0;}li{list-style:none;}.box{display:flex;flex-wrap:wrap;width:540px;margin:20px auto;}.box li{width:100px;height:100px;margin:0 10px 10px 0;}.box li:nth-child(5n+1){margin-right:0;}.box li img{width:100%;height:100%;border:2px solid #258DF2;border-radius:10px 0 10px 0;}</style></head><body><ulclass="box"><script>letarr=['./images/1.webp','./images/2.webp','./images/3.webp','./images/4.webp','./images/5.webp','./images/6.webp','./images/7.webp','./images/8.webp','./images/9.webp','./images/10.webp','./images/11.webp','./images/12.webp','./images/13.webp','./images/14.webp','./images/15.webp','./images/16.webp','./images/17.webp','./images/18.webp','./images/19.webp','./images/20.webp']letnum=prompt('请输入显示的英雄个数1~20之间:')for(leti=0;i<num;i++){document.write(`<li> <img src="${arr[i]}" alt=""> </li>`)}</script></ul></body></html>

排错题

排错题1

<body><!-- 请问以下代码会出现什么问题,如何解决? --><script>// 需求: 求 1~100之间的累加和// 注意: 此处有3个错误,找出并且修正letsum//错误1: sum 必须初始化为0,如果默认是是undefined,相加结果是 NaNfor(leti=1;i<100;i++;){// 错误2: 从1开始,是小于等于。 错误3: i++ 后面不需要加分号sum+=i}console.log(sum)</script></body>

排错题2

<!-- bug:请你找到下面代码的bug,把数字1打印出来 --><body><script>letsum=0letarr=[1,2,3,4,5]for(leti=1;i<arr.length;i++){// 错误: i 从 0 开始console.log(arr[i])}</script></body>

排错题3

<!-- bug:找到下面代码死循环的原因,并修改为正确的代码 --><body><script>for(leti=1;i<=5;i++){for(letj=1;j<=5;i++){// 错误: 这里是j++ 不是i++ ,不是考察同学眼力,而是很多同学不小心就写这个了,要小心console.log(`这是双重for循环`);}}</script></body>
版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/6/23 17:15:13

MediaPipe骨骼检测性能评测:CPU推理效率提升300%的秘密

MediaPipe骨骼检测性能评测&#xff1a;CPU推理效率提升300%的秘密 1. 引言&#xff1a;AI人体骨骼关键点检测的现实挑战 随着AI在健身指导、动作捕捉、虚拟试衣和人机交互等领域的广泛应用&#xff0c;人体骨骼关键点检测&#xff08;Human Pose Estimation&#xff09;已成…

作者头像 李华
网站建设 2026/7/1 5:52:59

Multisim示波器使用测量功能:精准读取电压周期

精准测量电压与周期&#xff1a;Multisim示波器实战全解析在电子电路的设计与教学中&#xff0c;理论计算只是第一步。真正验证一个放大器是否稳定、振荡器频率是否准确、滤波器响应是否理想——靠的不是公式推导&#xff0c;而是可观测、可量化、可重复的信号测量。NI Multisi…

作者头像 李华
网站建设 2026/6/29 5:05:37

AI人体姿态估计实战:33个关键点检测代码实例详解

AI人体姿态估计实战&#xff1a;33个关键点检测代码实例详解 1. 引言&#xff1a;AI 人体骨骼关键点检测的工程价值 随着计算机视觉技术的快速发展&#xff0c;人体姿态估计&#xff08;Human Pose Estimation&#xff09;已成为智能健身、动作捕捉、虚拟试衣、人机交互等场景…

作者头像 李华
网站建设 2026/7/1 18:10:16

MediaPipe本地运行优势:适用于嵌入式设备的轻量架构

MediaPipe本地运行优势&#xff1a;适用于嵌入式设备的轻量架构 1. 引言&#xff1a;AI人体骨骼关键点检测的现实挑战 在智能健身、动作捕捉、人机交互和安防监控等应用场景中&#xff0c;人体骨骼关键点检测&#xff08;Human Pose Estimation&#xff09;是实现行为理解与姿…

作者头像 李华
网站建设 2026/6/30 8:51:57

MediaPipe Pose入门必看:本地运行的高稳定性骨骼检测方案

MediaPipe Pose入门必看&#xff1a;本地运行的高稳定性骨骼检测方案 1. 技术背景与核心价值 随着AI在运动分析、虚拟试衣、人机交互等领域的广泛应用&#xff0c;人体姿态估计&#xff08;Human Pose Estimation&#xff09;已成为计算机视觉中的关键技术之一。其目标是从图…

作者头像 李华
网站建设 2026/6/29 10:57:32

MediaPipe姿态估计教育应用:在线舞蹈教学系统实战案例

MediaPipe姿态估计教育应用&#xff1a;在线舞蹈教学系统实战案例 1. 引言&#xff1a;AI驱动的在线舞蹈教学新范式 随着远程教育和智能健身的快速发展&#xff0c;传统视频教学已难以满足用户对动作反馈与纠错的需求。在舞蹈、瑜伽、体操等高度依赖肢体表达的领域&#xff0…

作者头像 李华