如何用JS/HTML将时间戳转换为“xx天前”的形式

将时间戳转换为类似“xx天前”的形式是一个常见的需求。下面我来详细讲解如何用JS/HTML实现这个功能。

第一步：获取当前时间戳和目标时间戳

JavaScript内置了一个用于获取当前时间戳的方法，即：

var now = Date.now();

如果要将一个日期字符串转换为时间戳，可使用Date.parse方法，例如：

var target = Date.parse('2022-01-01');

得到目标的时间戳。

第二步：计算时间差

有了当前时间戳和目标时间戳，我们就可以计算它们之间的时间差了。时间差可用毫秒数表示。计算时间差的代码如下：

var diff = now - target;

第三步：将时间差转换为“xx天前”的形式

时间差以毫秒为单位，为了将其转换为“xx天前”的形式，需要进行一定的计算。我们可以将时间差除以24小时，得到相差的天数，例如：

var daysAgo = Math.floor(diff / (24 * 60 * 60 * 1000));

Math.floor方法表示向下取整，确保得到整数天数。

接下来，我们可以按照不同的天数，返回不同的字符串，例如：

if(daysAgo == 0){
  return '今天';
} else if(daysAgo == 1){
  return '昨天';
} else if(daysAgo <= 7){
  return daysAgo + '天前';
} else {
  // 这里可以返回更加详细的日期，例如：2022-01-01
}

根据不同的天数，返回不同的字符串。特殊的，如果时间差为0，则返回“今天”，为1则返回“昨天”，否则返回“xx天前”。

下面是一个完整的函数示例：

function formatDate(timestamp){
  var now = Date.now();
  var target = timestamp;
  var diff = now - target;
  var daysAgo = Math.floor(diff / (24 * 60 * 60 * 1000));

  if(daysAgo == 0){
    return '今天';
  } else if(daysAgo == 1){
    return '昨天';
  } else if(daysAgo <= 7){
    return daysAgo + '天前';
  } else {
    // 这里可以返回更加详细的日期，例如：2022-01-01
  }
}

示例说明

示例一

我们有一个unix时间戳为1640882405024，应该如何将它转换为“xx天前”的形式？

var timestamp = 1640882405024; 
console.log(formatDate(timestamp));

输出结果为：今天。

示例二

我们要将2021年12月25日转换为时间戳，然后将其转换为“xx天前”的形式，应该如何实现？

var timestamp = Date.parse('2021-12-25'); 
console.log(formatDate(timestamp));

输出结果为：6天前。