在开发过程中，经常会遇到后台接口返回的是以秒为单位的数据（如：32000秒），而我们需要将其转换为一个更加易读的格式，例如“时:分:秒”或“小时:分钟:秒”。这类转换通常用于计时器、任务时长显示、视频播放时间等场景。本文将介绍如何实现秒数转时间的两种格式，分别为“时、分、秒”以及“时:分:秒”。
首先，我们通过一个函数，将秒数转换为“小时:分钟:秒”格式，并确保结果中包含必要的零填充（例如“08小时03分09秒”）。
方法实现：
const formatSeconds = (seconds) => {
let secondTime = parseInt(seconds); // 秒
let minuteTime = 0; // 分
let hourTime = 0; // 小时
if (secondTime >= 60) { // 秒数大于等于60，进行转换
minuteTime = parseInt(secondTime / 60); // 获取分钟数
secondTime = parseInt(secondTime % 60); // 获取剩余的秒数
if (minuteTime >= 60) { // 如果分钟数大于等于60，进行小时转换
hourTime = parseInt(minuteTime / 60); // 获取小时数
minuteTime = parseInt(minuteTime % 60); // 获取剩余的分钟数
}
}
let result = '';
// 处理秒数，确保格式为 00秒
result = secondTime < 10 ? `0${secondTime}秒` : `${secondTime}秒`;
// 处理分钟数，确保格式为 00分
result = minuteTime < 10 ? `0${minuteTime}分${result}` : `${minuteTime}分${result}`;
// 处理小时数，确保格式为 00小时
result = hourTime < 10 ? `0${hourTime}小时${result}` : `${hourTime}小时${result}`;
return result;
}
// 测试
let time = formatSeconds(32000);
console.log(time); // 输出: 08小时53分20秒
代码解析：
parseInt() 获取秒数，并进行分钟和小时的转换。08小时）。另外一个常见的格式是用冒号（:）分隔时、分、秒。比如：08:53:20。实现这个功能的原理与前面的类似，只是输出的分分隔符不同。
函数实现：
const getSeconds = (seconds) => {
let secondTime = parseInt(seconds); // 秒
let minuteTime = 0; // 分
let hourTime = 0; // 小时
if (secondTime >= 60) { // 秒数大于等于60，进行转换
minuteTime = parseInt(secondTime / 60); // 获取分钟数
secondTime = parseInt(secondTime % 60); // 获取剩余的秒数
if (minuteTime >= 60) { // 如果分钟数大于等于60，进行小时转换
hourTime = parseInt(minuteTime / 60); // 获取小时数
minuteTime = parseInt(minuteTime % 60); // 获取剩余的分钟数
}
}
let result = '';
// 处理秒数，确保格式为 00
result = secondTime < 10 ? `0${secondTime}` : `${secondTime}`;
// 处理分钟数，确保格式为 00
result = minuteTime < 10 ? `0${minuteTime}:${result}` : `${minuteTime}:${result}`;
// 处理小时数，确保格式为 00
result = hourTime < 10 ? `0${hourTime}:${result}` : `${hourTime}:${result}`;
return result;
}
// 测试
let time = getSeconds(32000);
console.log(time); // 输出: 08:53:20
代码解析：
padStart(2, '0') 或条件判断，确保秒、分、小时格式为两位数（例如：08:03:09）。: 作为分隔符，将小时、分钟和秒连接起来。这两个函数 formatSeconds 和 getSeconds 的核心原理是相同的，都通过将秒数转换为分钟和小时，然后拼接成最终的时间字符串。主要的区别在于：
formatSeconds 使用中文单位（如“小时”、“分”），而 getSeconds 使用冒号作为分隔符（如“08:53:20”）。formatSeconds 适用于中文时间显示，而 getSeconds 适用于标准的时:分:秒格式。计时器：如倒计时、计时器功能，显示剩余时间。
视频播放器：用于展示视频播放进度。
任务时长：记录任务完成的时长（例如任务处理、视频转换等）。
日志系统：用于显示系统运行时间、请求处理时长等。
为了提高代码的可维护性和扩展性，我们可以对以上两个函数进行一些优化：
parseInt() 操作来优化性能。改进后的优化版本：
// 统一时间转换函数
const convertTime = (seconds) => {
if (isNaN(seconds) || seconds < 0) return "00:00:00"; // 输入校验
let secondTime = parseInt(seconds);
let minuteTime = 0;
let hourTime = 0;
minuteTime = parseInt(secondTime / 60);
secondTime = parseInt(secondTime % 60);
if (minuteTime >= 60) {
hourTime = parseInt(minuteTime / 60);
minuteTime = parseInt(minuteTime % 60);
}
// 返回标准时:分:秒格式
return `${hourTime.toString().padStart(2, '0')}:${minuteTime.toString().padStart(2, '0')}:${secondTime.toString().padStart(2, '0')}`;
}
// 测试
console.log(convertTime(32000)); // 输出: 08:53:20
总结
时:分:秒 和 小时：分钟：秒 两种常见格式。convertTime 函数，我们简化了代码并提高了代码的复用性，同时确保了格式一致性和输入校验。这样的时间转换方法适用于各种场景，比如计时器、视频播放进度、任务时长统计等，有助于提升用户体验和代码的可维护性。
到此这篇关于JavaScript实现秒数转换时间的两种格式的文章就介绍到这了,更多相关JavaScript秒数转时间内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！