JS实战:用数组+循环打造“班级成绩管理系统”,告别流水账!

0 阅读3分钟

1. 前言:为什么要学数组?

哈喽大家好,我是心连欣。在之前的“ATM系统”案例中,我们只用了一个变量 total 来存余额。但是,如果现在老师让你统计全班 50 个同学的成绩,你难道要定义 50 个变量吗?let score1, score2, score3...

显然不可能!这时候,我们就需要数组这个容器。

今天,我们将结合数组循环,做一个功能更强大的 “班级成绩管理系统” 。它不仅能录入成绩,还能自动算出平均分,甚至能找出谁是第一名!

2. 案例需求分析

我们的系统需要具备以下功能:

  1. 数据容器:用一个数组来存储全班同学的成绩。

  2. 批量录入:利用循环,依次询问用户输入每个同学的成绩,并存入数组。

  3. 数据统计

    • 计算全班的总分
    • 计算全班的平均分
    • 找出最高分是多少。
  4. 数据筛选:统计有多少同学不及格(小于60分)。

3. 核心代码实现

这是一个综合性的案例,请仔细看代码中的注释,理解每一行的作用。

image.png image.png

image.png 运行结果如下:

image.png 依次输入学生的成绩,最终结果如下:

image.png

4. 知识点深度解析

这个案例虽然不长,但它把数组和循环的配合运用到了极致。

1. 数组的“动态扩容”:push 方法

在循环录入阶段,我们并没有一开始就定义数组的大小,而是使用 scores.push(score)

  • 作用:  这行代码就像是把数据“推”进数组的末尾。
  • 好处:  不管班级有 3 个人还是 300 个人,数组都会自动变长,非常灵活。

2. “打擂台”算法:求最大值

在寻找最高分 max 时,我们用到了一个经典的逻辑: let max = scores[0]; // 先假设第一个人是擂主 // ...在循环中...

if (currentScore > max) { max = currentScore; // 如果挑战者分更高,新擂主上位 } 这是编程中查找极值(最大值、最小值)的标准写法,一定要熟练掌握!

3. 累加器模式:求和

注意 sum 变量的初始化,必须写在循环外面,且初始值为 0

let sum = 0; // 循环内部

sum = sum + currentScore;

如果在循环内部定义 sum,每次循环它都会重置为 0,就无法累加了。

4. 数组与循环的“最佳CP”关系

  • 数组负责:把一堆数据整齐地排好队。
  • 循环负责:通过下标 i,从 0 到 数组.length - 1,一个不漏地把数据取出来处理。
  • 这就是我们常说的 “数组遍历”

5. 总结与思考

通过这个案例,我们从“处理单个数据”(如ATM余额)进化到了“处理批量数据”(全班成绩)。

课后小挑战:
目前的程序只能统计不及格人数。你能试着修改代码,把所有不及格的成绩单独提取出来,打印在页面上吗?(提示:可以在循环里再加一个 if 判断,然后把不及格的分数存到一个新的数组里)。


觉得这个案例对你有帮助吗?新手学习,高手分享自己的建议,欢迎点赞收藏,我们下一篇实战见!