javascript格式化日期时间方法汇总

下面我为大家详细讲解一下“javascript格式化日期时间方法汇总”的完整攻略。

1. 引言

在前端的工作中，日期时间格式转换是一个十分常见的问题。因此，有必要总结一下javascript中处理日期时间的API和格式化日期的方法，以便于在工作中快速有效地使用。

2. Date对象

在javascript中，我们可以使用内置的Date对象来处理日期时间。Date对象可以通过构造器创建实例，也可以直接调用静态方法获取当前时间等信息。

创建Date对象

我们可以使用new关键字和Date构造器来创建Date对象。

var date = new Date(); // 创建一个包含当前时间的Date对象
console.log(date); // 输出：Thu Aug 26 2021 11:30:00 GMT+0800 (中国标准时间)

也可以使用Date构造器来创建指定时间的Date对象，构造器参数可以是一个整数（UTC时间的毫秒数）、一个表示日期的字符串或者多个数字，依次表示年、月、日、小时、分钟、秒和毫秒。

var date = new Date(2021, 7, 26, 11, 30, 0, 0); // 创建一个包含指定时间的Date对象，月份从0开始计算
console.log(date); // 输出：Mon Aug 26 2021 11:30:00 GMT+0800 (中国标准时间)

获取和设置时间

Date对象提供了一系列方法来获取和设置年、月、日、小时、分钟、秒和毫秒数。

var date = new Date(2021, 7, 26, 11, 30, 0, 0);

var year = date.getFullYear(); // 获取年份
var month = date.getMonth(); // 获取月份，从0开始计算
var day = date.getDate(); // 获取日期
var week = date.getDay(); // 获取星期，0表示星期日，1表示星期一...
var hours = date.getHours(); // 获取小时
var minutes = date.getMinutes(); // 获取分钟
var seconds = date.getSeconds(); // 获取秒数
var milliseconds = date.getMilliseconds(); // 获取毫秒数

console.log(year, month, day, week, hours, minutes, seconds, milliseconds); // 输出：2021 7 26 2 11 30 0 0

我们也可以使用对应的set方法来设置时间。

var date = new Date(2021, 7, 26, 11, 30, 0, 0);

date.setFullYear(2022); // 设置年份为2022
date.setHours(12); // 设置小时为12
date.setMinutes(20); // 设置分钟为20
date.setSeconds(30); // 设置秒数为30

console.log(date); // 输出：Wed Aug 26 2022 12:20:30 GMT+0800 (中国标准时间)

3. 时间格式化

使用Date对象获取到的时间并不是很方便阅读和使用，因此我们需要对其进行格式化。

toISOString()方法

Date对象提供了一个toISOStirng()方法，可以将时间格式化为ISO标准格式：YYYY-MM-DDTHH:mm:ss.sssZ。其中T表示时间的分隔符，Z表示时区。

var date = new Date(2021, 7, 26, 11, 30, 0, 0);
console.log(date.toISOString()); // 输出：2021-08-26T03:30:00.000Z

toLocaleDateString()方法和toLocaleTimeString()方法

Date对象提供了toLocaleDateString()方法和toLocaleTimeString()方法，可以将时间格式化为本地时间的字符串。

var date = new Date(2021, 7, 26, 11, 30, 0, 0);

var dateString = date.toLocaleDateString(); // 格式化日期部分
var timeString = date.toLocaleTimeString(); // 格式化时间部分

console.log(dateString + ' ' + timeString); // 输出：2021/8/26 上午11:30:00

自定义格式化

除了使用内置的方法进行格式化，我们也可以使用自定义的方法来对时间进行格式化。下面是一个常用的自定义格式化函数。

function formatDate(date, fmt) {
  if (!date) return '';
  if (typeof date === 'string') {
    date = new Date(date.replace(/-/g, '/'));
  } else if (typeof date === 'number') {
    date = new Date(date);
  }
  var o = {
    'M+': date.getMonth() + 1, // 月份
    'd+': date.getDate(), // 日
    'H+': date.getHours(), // 小时
    'm+': date.getMinutes(), // 分
    's+': date.getSeconds(), // 秒
    'q+': Math.floor((date.getMonth() + 3) / 3), // 季度
    'S': date.getMilliseconds() // 毫秒
  };
  if (/(y+)/.test(fmt)) {
    fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
  }
  for (var k in o) {
    if (new RegExp('(' + k + ')').test(fmt)) {
      fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)));
    }
  }
  return fmt;
}

这个函数接受两个参数，第一个是Date对象或者日期字符串，第二个是格式化字符串。格式化字符串中可以包含的元素如下表所示。

元素	含义
yyyy	四位数字表示的年份
yy	两位数字表示的年份
M	月份，不加前导零
MM	月份，两位数字表示
d	日，不加前导零
dd	日，两位数字表示
H	小时，使用24小时制，不加前导零
HH	小时，使用24小时制，两位数字表示
h	小时，使用12小时制，不加前导零
hh	小时，使用12小时制，两位数字表示
m	分钟，不加前导零
mm	分钟，两位数字表示
s	秒钟，不加前导零
ss	秒钟，两位数字表示
S	毫秒数

下面是几个示例。

var date = new Date(2021, 7, 26, 11, 30, 0, 0);
console.log(formatDate(date, 'yyyy-MM-dd HH:mm:ss.S')); // 输出：2021-08-26 11:30:00.000
console.log(formatDate(date, 'yyyy/MM/dd hh:mm:ss')); // 输出：2021/08/26 11:30:00
console.log(formatDate(date, 'M/d/yyyy H:m:s')); // 输出：8/26/2021 11:30:0

4. 总结

以上就是javascript中处理日期时间和格式化日期的方法汇总。使用Date对象可以非常方便地获取和设置时间，使用内置方法或者自定义函数可以将时间格式化为我们需要的样子。这对于前端工作者来说是十分实用的技能。