如何测量 Javascript 所用的时间?

IT技术 javascript
2021-03-12 20:16:02

我创建了一个简单的游戏,当用户点击 16 个框时开始和结束计时器。

我想测量用户完成游戏所用的时间。我如何使用 Javascript 做到这一点?

我看了看不同的答案是这样,但我很难理解别人的代码。

我会假设它看起来像这样。

Timer Start: When user clicks the first box
Timer End: When user clicks the last box
1个回答

Date文件指出:

JavaScript 日期基于一个时间值,该时间值是自 1970 年 1 月 1 日午夜起的毫秒数,UTC

单击开始按钮,然后单击结束按钮。它会显示两次点击之间的秒数。

毫秒差异在变量中timeDiff使用它来查找秒/分钟/小时/或您需要的内容

var startTime, endTime;

function start() {
  startTime = new Date();
};

function end() {
  endTime = new Date();
  var timeDiff = endTime - startTime; //in ms
  // strip the ms
  timeDiff /= 1000;

  // get seconds 
  var seconds = Math.round(timeDiff);
  console.log(seconds + " seconds");
}
<button onclick="start()">Start</button>

<button onclick="end()">End</button>

或为现代浏览器做的另一种方式

使用performance.now()which 返回一个值,表示自时间原点以来经过的时间。该值是小数部分中带有微秒的双精度值。

时间原点是一个标准时间,被认为是当前文档生命周期的开始。

var startTime, endTime;

function start() {
  startTime = performance.now();
};

function end() {
  endTime = performance.now();
  var timeDiff = endTime - startTime; //in ms 
  // strip the ms 
  timeDiff /= 1000; 
  
  // get seconds 
  var seconds = Math.round(timeDiff);
  console.log(seconds + " seconds");
}
<button onclick="start()">Start</button>
<button onclick="end()">End</button>

@RodolfoCarvalho 您能否进一步解释为什么它根本不可靠?
2021-04-22 20:16:02
SO上有类似的问题(此处标记为重复)。不幸的是,并非所有这些都指向正确的方向。由于我无法添加答案,因此我想警告来这里的人。总之,使用new Date()是不可靠的,因为它受系统时钟的影响。它可能导致其他意外输出中的负持续时间。请参阅此答案以获得更长的咆哮stackoverflow.com/a/15641427并查看developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/... 中关于计算经过时间的说明
2021-05-15 20:16:02
感谢您的热心回答!非常非常清晰易懂!我会用这个来应用我的代码!
2021-05-18 20:16:02
这根本不可靠。在现代浏览器中,最好的办法是使用performance.now()来测量两个瞬间之间的持续时间。在上面的答案中,替换new Date()performance.now(). developer.mozilla.org/en-US/docs/Web/API/Performance/now
2021-05-20 20:16:02