在 JavaScript 中求平均值的示例

Muhammad Muzammil Hussain 2023年10月12日
  1. 平均值數學公式
  2. HTML 中的 JavaScript 平均方法示例
  3. 獲得相同結果的替代方法
在 JavaScript 中求平均值的示例

沒有任何內建方法可以在 JavaScript 中獲得平均值。我們通常會使用不同的技巧和方法來實現該功能來計算定義值的平均值。

本文將討論多個示例,以通過自定義宣告的函式找到使用 JavaScript 的平均值。

平均值數學公式

要了解 JavaScript 平均值,我們必須知道求平均值的常用數學公式。

average = (sum of all given values) / number of values

這是我們需要執行兩個步驟才能獲得準確結果的公式。

  • 計算所有給定值的總和
  • 將計算總和的結果除以值的數量

HTML 中的 JavaScript 平均方法示例

下面是 HTML 原始碼,它會顯示 Click to get Average 按鈕;我們將在該按鈕的單擊事件上呼叫自定義宣告的函式。該函式將使用迴圈語句計算給定陣列值的平均值,並最終返回結果。

我們將在 JavaScript alert() 框中顯示計算結果。

<!DOCTYPE html>
<html>
<head>
    <title>
        HTML | JavaScript Average method example
    </title>
    <script type="text/javascript">
    </script>
 
</head>
<body>
 
  <h2>Hi Users Check Average of values (28, 78, 32, 14).</h2>
  <button onclick="calculateAverage()">Click to get Average</button>

<script>
function calculateAverage() {
    // you can change the values of array
   let array = [28, 78, 32, 14]
   let i = 0
   let sum = 0
   let len = array.length;
   let result = 0
    
    // loop for calculate sum of array values
    while (i < len) {
        sum = sum + array[i++];
    }
      result = sum / len
    // simply shows the result in alert box
    alert("Average of ("+array+") is :  "+result);
}
</script>
 
</body>
<html>

在這個 HTML 頁面原始碼中,我們在點選事件上建立了一個名為 calculateAverage() 的按鈕。

你可以看到觸發 calculateAverage() 方法的按鈕 Click to get Average。在該方法的主體中,我們初始化了一個整數值陣列和其他有用的變數來計算平均值。

首先,我們必須計算我們正在尋找的所有給定值的總和以找到平均值。我們迭代程式碼語句以遍歷一個陣列到所有索引來執行那個小任務。

為了迭代程式碼語句,我們通常根據條件實現迴圈。我們在這裡使用了 while 迴圈,直到給定條件為 true,即當前索引小於陣列的長度或 index < length

我們使用 while 迴圈邏輯計算了所有陣列元素的總和,並將結果儲存在 sum 變數中。我們將 sum 變數值除以陣列的長度來計算平均值,然後將結果顯示在 alert() 框中。

獲得相同結果的替代方法

如下所示,你可以通過將 N 個值作為引數傳遞以返回平均值來獲得相同的功能。

function average(...nums) {
  let average = 0;
  for (const num of nums) {
    average += num / nums.length;
  }
  return average;
}
alert(average(28, 78, 32, 14));

我們只是使用 average(...nums) 方法來接收 N 個值。我們在這裡使用了 for 迴圈邏輯來計算平均值。

相關文章 - JavaScript Math