JavaScript，每5秒打印，已运行时间，和还剩多少时间，多少分，多少秒

红帽子船长

于 2024-08-21 02:56:44 发布

阅读量34

点赞数

为了实现这个需求，我们可以使用JavaScript的setInterval函数来每隔5秒执行一次操作，并使用Date对象来跟踪程序的开始时间和当前时间，从而计算出已运行时间和剩余时间（假设你有一个预定的总运行时间）。但是，请注意，对于“剩余时间”，这里我将假设一个固定的总运行时间，比如300秒（即5分钟），因为你没有具体说明总运行时间是多少。

下面是一个示例代码，演示了如何实现这个逻辑：

javascript复制代码
 // 假设总运行时间为300秒  
 
 const totalDuration = 300; // 秒  
 
   
 
 // 获取程序开始时间  
 
 let startTime = new Date().getTime();  
 
   
 
 // 每隔5秒执行一次  
 
 setInterval(function() {  
 
     // 获取当前时间  
 
     let currentTime = new Date().getTime();  
 
   
 
     // 计算已运行时间  
 
     let elapsedTime = currentTime - startTime;  
 
   
 
     // 计算剩余时间  
 
     let remainingTime = totalDuration - elapsedTime;  
 
   
 
     // 将剩余时间转换为分钟、秒  
 
     let minutes = Math.floor(remainingTime / 60);  
 
     let seconds = remainingTime % 60;  
 
   
 
     // 如果秒数小于10，则前面补0以保持格式（例如，"05"秒而不是"5"秒）  
 
     seconds = seconds < 10 ? '0' + seconds : seconds;  
 
   
 
     // 打印信息  
 
     console.log(`已运行时间: ${Math.floor(elapsedTime / 60)}分${elapsedTime % 60}秒`);  
 
     console.log(`还剩时间: ${minutes}分${seconds}秒`);  
 
   
 
     // 如果剩余时间小于等于0，则停止定时器  
 
     if (remainingTime <= 0) {  
 
         console.log('时间到！');  
 
         clearInterval(this); // 注意：这里的'this'可能不总是指向定时器ID，但在这个示例中可行  
 
     }  
 
 }, 5000); // 5000毫秒 = 5秒

注意：在setInterval的回调函数中，this的值依赖于函数的调用方式，而在这个示例中，虽然this似乎可以工作来取消定时器（因为它指向全局对象，这在浏览器环境中通常是window，且window.setInterval返回的ID是全局可访问的），但更好的做法是使用setInterval返回的ID来取消定时器。你可以将setInterval的返回值保存到一个变量中，并使用clearInterval函数和该变量来停止定时器。

javascript复制代码
 let timerId = setInterval(function() {  
 
     // ...  
 
     if (remainingTime <= 0) {  
 
         console.log('时间到！');  
 
         clearInterval(timerId); // 使用保存的定时器ID来停止定时器  
 
     }  
 
 }, 5000);