javascript - jQuery秒表，计算平均值并显示

Question

我正在制作秒表，目前它可以工作，但我希望我可以计算人们获得的平均时间。例如。假设我在 array 中有 5 次，如下所示:scores = ["00:32:192", "00:30:126", "00:31:542 ”、“00:25:236”、“00:36:320”]；。您现在可能会想:这到底是什么？时间是:分:秒:毫秒。使用 for 循环将数组打印到屏幕上。

jQuery

var int,
     ms=0,
     s=0,
     m=0;

$('#swatch').text("00:00:00");

function swatch(){

  var startTime = new Date().getTime();
  int = setInterval(function(){
      var time = new Date().getTime();
      var dif = time-startTime;
      ms= dif%1000;
      s = Math.floor(dif/1000)%60;
      m = Math.floor(dif/1000/60)%60;

        if(ms < 10) {
            ms = '0'+ms;
        }

        if(s < 10) {
            s = '0'+s;
        }

        if(m < 10) {
            m = '0'+m;
        }

        $('#swatch').text(m+':'+s+':'+ ms);

  },1);

}

var scores= [];



$(document).on('keydown', function(e){
    var result = $('#swatch').text();
    var i = parseInt(scores.length);

    if(e.keyCode == 32 && !int){
        swatch();

    } else if (e.keyCode == 32){
        clearInterval(int);
        int=0;

        scores.push(result);
        $('#score ol').append('<li>' + scores[i] + '</li>');

        if(scores.length >= 5) {
            $('#ao5').html("ao5: 00:27:43");
            $('#ao5').slideDown(500);
        }
        if (scores.length >= 12) {
            $('#ao12').html("ao12: 00:27:43");
            $('#ao12').slideDown(500);
        }
    }

});

在上面的代码中，您会看到:

if(scores.length >= 5) {
    $('#ao5').html("ao5: 00:27:43");
    $('#ao5').slideDown(500);
}
if (scores.length >= 12) {
    $('#ao12').html("ao12: 00:27:43");
    $('#ao12').slideDown(500);
}

我想要如果数组有 5 个不同的时间值(如上面我向您展示数组格式的示例)，它会在屏幕上输出平均值。正如你所看到的，我只是为了自己想象它而填写它，但我想要一个计算它的函数。我在 jQuery 中构建它，因为计时器在这里比在 JS 中工作得更好。

如果你们中的一些人可以给我一个例子，并使用其中的函数重写我的代码，那就太好了。我真的为此苦苦挣扎了好几天，以弄清楚如何计算 5 和/或 12 的平均值。

谢谢。

Answer 1

请注意，我下面提供的代码不直接依赖于 JQuery 或任何库。你向它提供一组“时间字符串”，它会返回一个平均值。您可以使用您选择的任何库来获取该字符串数组。

首先，您需要一个实用函数，它将时间字符串分解为其组成部分:

var str_to_time = function(time_str) {
  var pieces =time_str.split(':');
  return {
    minutes: parseInt(pieces[0], 10),
    seconds: parseInt(pieces[1], 10),
    milliseconds: parseInt(pieces[2], 10)
  };
};

现在是一个将时间字符串数组转换为时间数组的函数:

var str_array_to_time_array = function(str_array) {
  return str_array.map(str_to_time);
};

最后，将所有这些值平均在一起的方法:

var average_time = function(time_array) {
  var minutes = 0;
  var seconds = 0;
  var milliseconds = 0;

  for (var i = 0; i < time_array.length; i++) {
    minutes += time_array[i].minutes;
    seconds += time_array[i].seconds;
    milliseconds += time_array[i].milliseconds;
  }

  minutes /= time_array.length;
  seconds /= time_array.length;
  milliseconds /= time_array.length;

  // Minutes and seconds may be fractional. Carry the fractions down.
  seconds += (minutes - Math.floor(minutes)) * 60;
  minutes = Math.floor(minutes);
  milliseconds += (seconds - Math.floor(seconds)) * 1000;
  seconds = Math.floor(seconds);
  milliseconds = Math.round(milliseconds);
  // if milliseconds is >= 1000, add a second.
  seconds += Math.floor(milliseconds / 1000);
  milliseconds %= 1000;
  // If seconds >= 60, add a minute.
  minutes += Math.floor(seconds / 60); 
  seconds %= 60;

  return {
    minutes: minutes,
    seconds: seconds,
    milliseconds: milliseconds
  };
};

现在您可以调用类似以下内容来获取平均值:

average_time(str_array_to_time_array(['33:23:354', '34:00:32']))
// Object {minutes: 33, seconds: 41, milliseconds: 693}