JS实现时间格式化的方式汇总

2023年5月27日下午2:23 • JavaScript

让我来为你详细讲解如何实现JavaScript时间格式化。

1. 背景

在日常编程中，我们常常需要将时间戳转换为可读的时间格式，比如将 1616685660000 转换为 2021-03-25 16:14:20 的形式。JavaScript提供了以下几种方式来实现时间格式化：

使用原生JavaScript Date对象的 toLocaleString() 方法，但这种方法只适合处理简单的时间格式
使用第三方库，比如Moment.js、date-fns等
自己实现时间格式化函数

2. 使用toLocaleString()方法格式化时间

Date对象的toLocaleString()方法可以将日期对象转换为字符串。该方法可以传递日期格式化的选项，例如"en-US"、"zh-CN"等语言环境。如果不提供参数，则该方法使用默认的选项。

下面是一个示例代码，将时间戳转换为"YYYY-MM-DD hh:mm:ss"的格式。

const date = new Date(1616685660000); //创建Date对象，设置时间戳为1616685660000
const formatDate = date.toLocaleString('zh-CN', {
  year: 'numeric',
  month: '2-digit',
  day: '2-digit',
  hour: '2-digit',
  minute: '2-digit',
  second: '2-digit'
}); //使用toLocaleString()方法将date对象格式化为时间字符串
console.log(formatDate); //"2021-03-25 16:14:20"

使用toLocaleString()方法可以方便快捷地实现时间格式化，但是其支持的格式有限，如果需要更丰富的格式化选项，可以考虑使用第三方库或自己实现时间格式化函数。

3. 使用Moment.js库格式化时间

Moment.js是一个强大的JavaScript时间处理库，它提供了丰富的时间格式化选项，并支持各地区的时区，非常适合用于Web开发，是处理日期数据非常好的帮手。

如果要在项目中使用Moment.js，请先引入Moment.js库。

<script src="https://cdn.bootcdn.net/ajax/libs/moment.js/2.29.1/moment.min.js"></script>

下面是一个示例代码，将时间戳转换为"YYYY-MM-DD hh:mm:ss"的格式。

const timestamp = 1616685660000; //设置时间戳为1616685660000
const date = moment(timestamp).format('YYYY-MM-DD HH:mm:ss'); //使用moment()方法创建moment对象，使用format()方法格式化日期时间
console.log(date); //"2021-03-25 16:14:20"

Moment.js提供了丰富的时间处理功能，如果需要使用Moment.js处理更复杂的时间数据，可以查看Moment.js官方文档。

4. 自己实现时间格式化函数

如果不想使用第三方库，也不想使用Date对象的toLocaleString()方法，则可以自己实现时间格式化函数。

下面是一个示例代码，将时间戳转换为"YYYY-MM-DD hh:mm:ss"的格式。

function formatDate(timestamp) {
  const date = new Date(timestamp); //根据时间戳创建date对象
  const year = date.getFullYear(); //获取年份
  const month = ('0' + (date.getMonth() + 1)).slice(-2); //获取月份
  const day = ('0' + date.getDate()).slice(-2); //获取日
  const hour = ('0' + date.getHours()).slice(-2); //获取小时
  const minute = ('0' + date.getMinutes()).slice(-2); //获取分钟
  const second = ('0' + date.getSeconds()).slice(-2); //获取秒
  return `${year}-${month}-${day} ${hour}:${minute}:${second}`; //返回格式化后的时间字符串
}

console.log(formatDate(1616685660000)); //"2021-03-25 16:14:20"

自己实现时间格式化函数可以根据自己的需求自由设计格式化的方式，可以灵活地处理各种时间数据，但需要自己编写代码，相对比较麻烦。