输入到文本字段的一系列数字的总和和平均值

时间:2018-02-16 05:22:50

标签: javascript arrays loops sum average

我正在尝试创建一个应用程序,用于计算输入到由空格分隔的文本字段中的数字的总和和平均值。

我被困在你必须放入循环以计算间隔输入的总和和平均值的部分。在我输入代码时,我一直在使用console.log进行测试。

任何指导都会有所帮助。第一次做javascript。我查看了这个网站上的表格,似乎所有的sum / avg javascript问题都不是基于输入文本的。这就是为什么我要创建一个新问题。

HTML和Javascript在

之下
<body>
<input type="text" id="numberSeries" />
<button id="calculateSumAverage" onclick="calculateSumAverage();">Calculate</button>
<div id="calculationOutput"></div>
</body>

Javascript

function calculateSumAverage() {

    //grab the input
    var numberSeries = document.getElementById("numberSeries").value;
    //split it using.split(" ")
    var arr = numberSeries.split("  ");

    //set sum var to 0
    var sum = 0;

    //set avg var to 0
    var avg = 0;

    //loop input array and sum
    for (var i=0; i<arr.length; i++){
        sum += arr[i];
    }
    console.log(sum);

    //divded by
    //calculate avg divided by myarray.length

    //output to div
}

4 个答案:

答案 0 :(得分:3)

// Here is your function:
/*function calculateSumAverage() {
    //grab the input
    var numberSeries = document.getElementById("numberSeries").value;
    //split it using.split(" ")
    var arr = numberSeries.split("  ");
    //set sum var to 0
    var sum = 0;
    //set avg var to 0
    var avg = 0;
    //loop input array and sum
    for (var i=0; i<arr.length; i++){
        sum += arr[i];
    }
    console.log(sum);
    //divded by
    //calculate avg divided by myarray.length
    //output to div
}*/

// Here is a way to do it functionally:

function calculateSumAverage() {
  // This is the string that contains the numbers separated by a space.
  var inputValue = document.getElementById('numberSeries').value;
  
  var values = inputValue.split(' ')
    .map((val) => parseInt(val))
    .filter((val) => !isNaN(val));
    
  var sum = values.reduce((currentVal, nextVal) => currentVal + nextVal, 0);
  
  document.getElementById('calculationOutput').innerHTML = `Average: ${sum / values.length}`;
}
<body>
  <input type="text" id="numberSeries" />
  <button id="calculateSumAverage" onclick="calculateSumAverage();">Calculate</button>
  <div id="calculationOutput"></div>
</body>

答案 1 :(得分:1)

您的代码很好,除了sum += parseInt(arr[i]);您需要将每个字符串输入解析为整数

答案 2 :(得分:0)

input type="text"会给出一个字符串。要分割这个字符串,请使用var arr = numberSeries.split("");,注意引号之间没有空格。要将每个字符串转换为数字,请使用一元运算符。

sum += +arr[i]; plus(+)之前的arr[i]符号会将字符串转换为数字。除非转换为数字,否则字符串连接将生成如下0123...

&#13;
&#13;
function calculateSumAverage() {

  //grab the input
  var numberSeries = document.getElementById("numberSeries").value;
  //split it using.split(" ")
  var arr = numberSeries.split("");

  //set sum var to 0
  var sum = 0;

  //set avg var to 0
  var avg = 0;
  console.log(arr)
  //loop input array and sum
  for (var i = 0; i < arr.length; i++) {
    sum += +arr[i];
  }
  console.log(sum);
}
&#13;
<input type="text" id="numberSeries" />
<button id="calculateSumAverage" onclick="calculateSumAverage();">Calculate</button>
<div id="calculationOutput"></div>
&#13;
&#13;
&#13;

答案 3 :(得分:0)

试试这个

function calculateSumAverage() 
{
	var numberSeries = document.getElementById("numberSeries").value;
	var arr = numberSeries.split("");
	var sum = 0;
	var avg = 0;
	for (var i = 0; i < arr.length; i++) 
	{
		sum += parseInt(arr[i]);
	}
}