迹忆客 专注技术分享

当前位置:主页 > 学无止境 > WEB前端 > JavaScript >

在 JavaScript 中求平均值的示例

作者:迹忆客 最近更新:2024/03/17 浏览次数:

没有任何内置方法可以在 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 循环逻辑来计算平均值。

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

Do you understand JavaScript closures?

发布时间:2025/02/21 浏览次数:108 分类:JavaScript

The function of a closure can be inferred from its name, suggesting that it is related to the concept of scope. A closure itself is a core concept in JavaScript, and being a core concept, it is naturally also a difficult one.

Do you know about the hidden traps in variables in JavaScript?

发布时间:2025/02/21 浏览次数:178 分类:JavaScript

Whether you're just starting to learn JavaScript or have been using it for a long time, I believe you'll encounter some traps related to JavaScript variable scope. The goal is to identify these traps before you fall into them, in order to av

How much do you know about the Prototype Chain?

发布时间:2025/02/21 浏览次数:150 分类:JavaScript

The prototype chain can be considered one of the core features of JavaScript, and certainly one of its more challenging aspects. If you've learned other object-oriented programming languages, you may find it somewhat confusing when you start

用 jQuery 检查复选框是否被选中

发布时间:2024/03/24 浏览次数:102 分类:JavaScript

在本教程中学习 jQuery 检查复选框是否被选中的所有很酷的方法。我们展示了使用直接 DOM 操作、提取 JavaScript 属性的 jQuery 方法以及使用 jQuery 选择器的不同方法。你还将找到许多有用的

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便