JavaScript 数组求平均值：完整教程与常见问题解析-html教程-PHP中文网

JavaScript 数组求平均值：完整教程与常见问题解析

心靈之曲

发布： 2025-09-24 20:03:01

原创

558人浏览过

javascript 数组求平均值：完整教程与常见问题解析

本文旨在帮助开发者理解如何在 JavaScript 中计算数组元素的平均值。我们将探讨使用 reduce() 方法实现平均值计算的正确方法，并解决在处理用户输入时可能遇到的类型转换问题。通过本文，你将能够编写出更健壮、准确的 JavaScript 代码。

使用 reduce() 方法计算数组平均值

JavaScript 的 reduce() 方法是一种强大的工具，它可以将数组中的所有元素归约为单个值。在计算平均值时，我们可以利用 reduce() 方法求和，然后除以数组的长度。

const marks = [100, 100, 100, 100, 100];
const average = marks.reduce((a, b) => a + b, 0) / marks.length;
console.log(`Average: ${average}`); // 输出: Average: 100

登录后复制

这段代码首先定义了一个包含分数的数组 marks。然后，使用 reduce() 方法将数组中的所有元素相加。reduce() 方法接受两个参数：一个回调函数和一个初始值。回调函数接受两个参数：累加器 a 和当前元素 b。在每次迭代中，回调函数将当前元素添加到累加器中。初始值 0 是累加器的初始值。最后，将总和除以数组的长度，得到平均值。

处理用户输入：类型转换至关重要

在实际应用中，数组的数据可能来自用户输入。从 HTML 输入框获取的值通常是字符串类型，需要将其转换为数字类型才能进行数学运算。否则，+ 运算符会将字符串连接起来，而不是执行加法。

以下是一个示例，展示了如何从 HTML 输入框获取值，并计算平均值：

立即学习“Java免费学习笔记（深入）”；

先见AI

数据为基，先见未见

查看详情

<!DOCTYPE html>
<html>
<head>
  <title>Calculate Average</title>
</head>
<body>
  <input type="number" id="num1" value="100"><br><br>
  <input type="number" id="num2" value="100"><br><br>
  <input type="number" id="num3" value="100"><br><br>
  <input type="number" id="num4" value="100"><br><br>
  <input type="number" id="num5" value="100"><br><br>
  <button onclick="calculateAverage()">Calculate</button>
  <p id="result"></p>

  <script>
    function calculateAverage() {
      const num1 = Number(document.getElementById("num1").value);
      const num2 = Number(document.getElementById("num2").value);
      const num3 = Number(document.getElementById("num3").value);
      const num4 = Number(document.getElementById("num4").value);
      const num5 = Number(document.getElementById("num5").value);

      const marks = [num1, num2, num3, num4, num5];
      const average = marks.reduce((a, b) => a + b, 0) / marks.length;

      document.getElementById("result").textContent = `Average: ${average}`;
    }
  </script>
</body>
</html>

登录后复制

在这个示例中，我们使用 Number() 函数将从输入框获取的字符串值转换为数字。这确保了 reduce() 方法执行正确的加法运算。

注意事项：