JavaScript 简易的秒表计时器

214 阅读1分钟

实现一个简易的秒表计时器,要求点击开始按钮进行计时,点击停止按钮暂停即使,再次点击开始按钮会继续计时。

最近面试第二次遇到这个题了,第一次是快手的一面面试题,当时面试官让我用 Vue 写,磕磕绊绊写出来了,面试完也没想仔细看看代码优化一下,结果今天招商银行的笔试又遇到这道题了,所以决定好好整理一下。

<input id="counter" type="text" readonly>
<button onclick="start()">开始</button>
<button onclick="stop()">停止</button>

<script>
  let step = 0;
  let intervalId = null;
  function count() {
    document.getElementById('counter').value = step;
    step = step + 1;
  }
  function start() {
    if (intervalId===null) {    //没有定时器时再执行
      count();
      intervalId = setInterval(count, 1000);
    }
  }
  function stop() {
    clearInterval(intervalId);
    intervalId = null;    //clearInterval之后需要将intervalId=null
  }
</script>