在前端开发中，我们有时候需要将时间间隔（例如时间戳）转换成更易读的形式，比如将 600 秒转换成 "10 分钟"。本文将介绍如何实现这个功能。
实现思路
要将时间间隔转换成易读的形式，我们需要确定两个因素：时间间隔的单位和显示的格式。常见的时间单位包括秒、分钟、小时、天、周等；常见的格式包括 X 分钟前、X 小时前、X 天前 等等。
对于单位的选择，我们可以使用下面的规则：
- 如果时间小于 60 秒，使用秒作为单位；
- 如果时间小于 60 分钟，使用分钟作为单位；
- 如果时间小于 24 小时，使用小时作为单位；
- 如果时间小于 7 天，使用天作为单位；
- 否则，使用周作为单位。
对于格式的选择，我们可以使用下面的规则：
- 如果时间间隔在 1 分钟以内，显示
"刚刚"; - 如果时间间隔在 1 小时以内，显示
"X 分钟前"； - 如果时间间隔在 1 天以内，显示
"X 小时前"； - 如果时间间隔在 7 天以内，显示
"X 天前"； - 否则，显示
"X 周前"。
实现代码
基于上面的思路，我们可以编写以下 JavaScript 代码：
-- -------------------- ---- -------
-------- -------------------- -
----- ---------- - ---
----- -------- - -- - -----------
----- ------- - -- - ---------
----- -------- - - - --------
--- ----- ------
-- ----- - ----------- -
---- - ----
----- - -----
- ---- -- ----- - --------- -
---- - -----
----- - --------------- - ------------
- ---- -- ----- - -------- -
---- - -----
----- - --------------- - ----------
- ---- -- ----- - --------- -
---- - ----
----- - --------------- - ---------
- ---- -
---- - ----
----- - --------------- - ----------
-
-- ------ --- -- -
------ -----
- ---- -- ------ - --- -
------ --------- ----------
- ---- -
----- ---- - --- --------------- - ---- - ------
----- ---- - -------------------
----- ----- - ----------------------- - ---
----- --- - ------------------------
------ --------------------------
-
-
-------- ---------- -
------ - - -- - ------- - --
-上面的代码定义了一个 formatDuration 函数，它接受一个时间间隔（单位为秒）作为参数，返回一个易读的字符串。如果时间间隔小于 1 分钟，返回 "刚刚"；否则，根据时间间隔的大小选择合适的单位和格式。
使用示例
我们可以使用下面的代码来测试上面的 formatDuration 函数：
console.log(formatDuration(30)); // "30 秒前" console.log(formatDuration(90)); // "1 分钟前" console.log(formatDuration(3600)); // "1 小时前" console.log(formatDuration(86400)); // "1 天前" console.log(formatDuration(86400 * 7)); // "1 周前" console.log(formatDuration(86400 * 31)); // "2023-03-07"
在上面的示例中，我们分别使用了不同大小的时间间隔来调用 formatDuration 函数，并打印了函数的返回值。我们可以看到，对于不同大小的时间间隔，函数都返回了相应的易读字符串。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/14235