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當前時間格式化等。不同的需求和場景也需要不同的時間格式化方式，開發人員可以根據具體的情況選擇合適的時間格式化方法。