JavaScript时间格式化详解

JavaScript是一种非常强大的编程语言，也在Web领域中被广泛使用。时间相关的操作是Web开发中很常见的功能之一，而时间格式化是时间相关功能中非常重要的一部分。在JavaScript中，时间格式化指的是将时间从Date对象转换为指定格式的字符串。本篇文章将从多个方面详细介绍JavaScript中的时间格式化。

一、JS时间格式化输出

JavaScript中的Date对象自带了一些方法，可以用于获取不同形式的时间数据，如年、月、日等。但是Date对象内置的方法不能直接输出指定格式的时间字符串，需要自定义方法进行格式化。

下面是一个JS时间格式化输出的代码示例：

function formatDate(time,fmt) {
  let date = new Date(time);
  const 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() + '').substring(4 - RegExp.$1.length));
  }
  for (let k in o) {
    if (new RegExp('(' + k + ')').test(fmt)) {
      fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substring(('' + o[k]).length)));
    }
  }
  return fmt;
}

此函数将传入的时间数据time转换为Date对象，并按照fmt的指定格式格式化输出，常见的格式化包括yyyy-MM-dd hh:mm:ss和yyyy/MM/dd hh:mm:ss等。

二、JS格式化时间格式

在JS时间格式化输出的基础上，我们可以自定义date格式，同时在定义格式时加入默认值以便于使用。下面是一个JS格式化时间格式的代码示例：

const dateUtils = {
  format(time, formatStr) {
    const format = formatStr || 'yyyy-MM-dd hh:mm:ss'; // 默认显示格式
    return formatDate(time, format);
  }
};

这个函数将传入的时间数据time和格式formatStr传给formatDate函数进行格式化操作，支持自定义格式并设定默认值。

三、JS时间格式化方法

除了上述手动编写格式化输出的方法外，JavaScript还提供了一些自带的时间格式化方法，例如toLocaleTimeString()和toLocaleDateString()等。它们能够直接将Date对象转换为指定格式的字符串，但是由于输出格式和各个浏览器不尽相同，所以使用时需要进行充分的测试和兼容性处理。

下面是一个JS时间格式化方法的代码示例：

const formatTime = (date) => {
  const options = { hour12: false };
  return date.toLocaleTimeString('en-US', options);
};

这个函数将传入的时间数据date作为参数，调用toLocaleTimeString()方法，获取指定格式的字符串时间数据。其中options参数设置为hour12: false，表示输出为24小时制，而不是默认的12小时制。

四、JS时间格式化处理方法

在后端中，日期可能会以时间戳的形式返回，而前端需要将时间戳转化为可阅读的时间格式。下面是一个JS时间格式化处理方法的代码示例：

const dateParser = (time) => {
  const date = new Date(parseInt(time) * 1000);
  const year = date.getFullYear();
  let month = date.getMonth() + 1 >= 10 ? date.getMonth() + 1 : `0${date.getMonth() + 1}`;
  let day = date.getDate() >= 10 ? date.getDate() : `0${date.getDate()}`;
  return `${year}-${month}-${day}`;
};

这个函数将传入的时间戳数据time转换为Date对象，并格式化输出为年-月-日的形式，支持自定义格式格式化输出。

五、JS时间格式化yyyymmdd

有些场景需要用到yyyymmdd格式的时间数据，这时可以借助正则表达式把时间格式化输出为yyyymmdd的形式。

下面是一个JS时间格式化yyyymmdd的代码示例：

function formatDate(date) {
  const y = date.getFullYear();
  let m = date.getMonth() + 1;
  m = m < 10 ? '0' + m : m;
  const d = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
  return y + m + d;
}

这个函数将传入的Date对象转换为字符串，返回yyyymmdd格式的时间数据。

六、JS时间格式化输出星期

如果需要输出精确到星期的时间数据，可以使用JavaScript内置的toLocaleDateString()方法。

下面是一个JS时间格式化输出星期的代码示例：

function formatWeek(time){
  let date = new Date(time);
  let week = ['日', '一', '二', '三', '四', '五', '六'][date.getDay()];
  return week;
}

这个函数将传入的时间数据time转换为Date对象，并获取星期信息后输出星期信息。其中week数组的下标对应的是Date对象的星期下标。

七、时间格式化输出JS

在前端开发中，除了JavaScript外，也有其他JavaScript库可以用于时间格式化，如moment.js等。这些库一般都是对JavaScript自带的时间对象进行封装，提供了比较全面的时间格式化方法。

下面是一个时间格式化输出JS的代码示例：

const time = new Date();
const formatTime = moment(time).format('YYYY-MM-DD HH:mm:ss');
console.log(formatTime);

这个代码调用了moment.js库，将传入的时间数据转换为moment对象，并调用format()方法，指定输出格式为YYYY-MM-DD HH:mm:ss。

八、jQuery时间格式化

jQuery是一个非常流行的JavaScript库，封装了很多常用的DOM操作和Ajax功能，同时也提供了一些操作时间的方法，如date()和timeago()等。

下面是一个jQuery时间格式化的代码示例：

$(document).ready(function() {
  const date = $.now();  // 获取当前时间
  const formatDate = $.format.date(date, 'yyyy/MM/dd HH:mm:ss');  // 格式化时间
  $('#time').text(formatDate);  // 将格式化后的时间赋值到指定Dom元素
});

这个代码监听文档加载事件，使用jQuery的$.now()方法获取当前时间，并调用$.format.date()方法将时间格式化输出，将格式化后的数据赋值给指定的DOM元素。

九、JS当前时间格式化

获取当前时间并进行格式化处理是非常常见的需求，在JavaScript中可以使用内置的方法获取当前时间，并结合上述时间格式化方法进行格式化操作。

下面是一个JS当前时间格式化的代码示例：

const formatNowTime = (formatStr) => {
  const date = new Date();
  return dateUtils.format(date, formatStr);
};

这个函数获取当前时间并赋值给Date对象，再结合上述自定义的时间格式化方法format()对时间格式进行格式化输出。formatStr为自定义的格式字符串。

总结

本篇文章详细介绍了JavaScript中时间格式化的多个方面，包括JS时间格式化输出、JS格式化时间格式、JS时间格式化方法、JS时间格式化处理方法、JS时间格式化yyyymmdd、JS时间格式化输出星期、时间格式化输出JS、jQuery时间格式化，以及JS当前时间格式化等。不同的需求和场景也需要不同的时间格式化方式，开发人员可以根据具体的情况选择合适的时间格式化方法。