JavaScript开发之分数求和与平均分案例（数组求和与平均值的应用）

小咪咪 2022-11-03 15:23 178阅读 0赞

今天，运用JavaScript的相关知识，在数组求和与平均值的基础上制作了分数求和与平均分的案例。希望我们互相学习，共同进步！  
**最终效果图：**  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA2MjkwNw_size_16_color_FFFFFF_t_70_pic_center]![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA2MjkwNw_size_16_color_FFFFFF_t_70_pic_center 1]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA2MjkwNw_size_16_color_FFFFFF_t_70_pic_center 2]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA2MjkwNw_size_16_color_FFFFFF_t_70_pic_center 3]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA2MjkwNw_size_16_color_FFFFFF_t_70_pic_center 4]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA2MjkwNw_size_16_color_FFFFFF_t_70_pic_center 5]

**js代码部分：**

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>1.数组求和和平均值</title>
        <script>
            // 1.在弹出框输入总的学科数(用num表示)
            // 2.依次输入各门学科的分数
            // 3.用for 循环表达弹出的次数跟学科总数的关系，其中i <= num
            // 4.先求总成绩（sum）， 再求平均成绩（average）
            var num = prompt('请输入总科目数:'); // num 总的科目数
            var sum = 0; // 求和
            var average = 0; // 求平均值
            for (var i = 1; i <= num; i++) {
        
                var score = prompt('请输入第' + i + '门分数');
                // 字符串型的需要转换为数字型
                sum = sum + parseFloat(score);
            }
            average = sum / num;
            alert('个人总分是：' + sum);
            alert('个人平均分是：' + average);
        </script>
    </head>
    <body>
    </body>
    </html>

**小结：**  
数组求和与平均值的应用多式多样，比如班级某科目总分、班级单科平均分等等。希望大家不吝赐教，互相学习，共同进步！感谢大家！

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA2MjkwNw_size_16_color_FFFFFF_t_70_pic_center]: https://img-blog.csdnimg.cn/20210228203901896.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA2MjkwNw==,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA2MjkwNw_size_16_color_FFFFFF_t_70_pic_center 1]: /images/20221023/5929dc5273094433845d4dda220a51e8.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA2MjkwNw_size_16_color_FFFFFF_t_70_pic_center 2]: /images/20221023/bf4a121060d241318d9d80cd86b5df07.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA2MjkwNw_size_16_color_FFFFFF_t_70_pic_center 3]: /images/20221023/d2da52477d5745d498692e9416b48c50.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA2MjkwNw_size_16_color_FFFFFF_t_70_pic_center 4]: /images/20221023/46ddf539e2fa4a1ba633fa2a4623d5f3.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA2MjkwNw_size_16_color_FFFFFF_t_70_pic_center 5]: /images/20221023/9b334db829c24b8a9a1d1e84d5d1c9ce.png