用JavaScript格式化日期為年-月-日的技巧

一、什麼是日期格式化

在編程中，日期格式化是指將日期轉換為特定格式的過程。在不同的國家和地區，日期的表示方法可能不一樣，例如美國使用「月/日/年」的格式，而歐洲則常用「日/月/年」的格式。為了保證程序的可用性和易讀性，我們需要將日期轉換為統一的格式。

二、JavaScript內置日期對象

在JavaScript中，Date對象是內置的日期對象，可以通過它來表示和處理日期。可以使用new關鍵字創建一個Date對象，如下所示：

const today = new Date();
console.log(today);  // 輸出當前日期

輸出結果：Wed Sep 29 2021 11:05:10 GMT+0800 (中國標準時間)

默認情況下，創建的Date對象表示當前日期和時間，可以通過各種方法來獲得日期和時間的各個部分。

const year = today.getFullYear();
const month = today.getMonth() + 1;
const day = today.getDate();
console.log(`${year}-${month}-${day}`);  // 輸出當前日期的年-月-日格式

輸出結果：2021-9-29

三、格式化日期的技巧

1. 使用padStart方法對日期進行補零處理

當月份或日期小於10時，將會輸出單個數字，這時我們需要對其進行補零處理。可以使用padStart方法在字元串前面補0，它的第一個參數指定字元串的總長度，第二個參數指定用於補齊的字元串。

const year = today.getFullYear();
const month = (today.getMonth() + 1).toString().padStart(2, '0');
const day = today.getDate().toString().padStart(2, '0');
console.log(`${year}-${month}-${day}`);  // 輸出當前日期的年-月-日格式（帶前導零）

輸出結果：2021-09-29

2. 使用數組和模板字元串拼接日期字元串

將年、月、日拼接成字元串的方法有很多種，其中使用數組結合模板字元串拼接的方法更加可讀性強。

const dateArr = [
  today.getFullYear(),
  (today.getMonth() + 1).toString().padStart(2, '0'),
  today.getDate().toString().padStart(2, '0')
];
console.log(`${dateArr.join('-')}`);  // 輸出當前日期的年-月-日格式（帶前導零）

輸出結果：2021-09-29

3. 使用字元串模板和replace方法格式化日期

使用字元串模板和replace方法可以更加靈活地格式化日期，可以自由組合日期顯示格式。

const strTemplate = '現在是{year}年{month}月{day}日';
const replaceTemplate = str => str
  .replace(/{year}/, today.getFullYear())
  .replace(/{month}/, (today.getMonth() + 1).toString().padStart(2, '0'))
  .replace(/{day}/, today.getDate().toString().padStart(2, '0'));
console.log(replaceTemplate(strTemplate));  // 輸出格式化後的日期字元串

輸出結果：現在是2021年09月29日

四、完整代碼示例

const today = new Date();

// 方法1：使用padStart方法對日期進行補零處理
const dateStr1 = `${today.getFullYear()}-${(today.getMonth() + 1).toString().padStart(2, '0')}-${today.getDate().toString().padStart(2, '0')}`;
console.log(dateStr1);  // 輸出當前日期的年-月-日格式（帶前導零）

// 方法2：使用數組和模板字元串拼接日期字元串
const dateArr = [
  today.getFullYear(),
  (today.getMonth() + 1).toString().padStart(2, '0'),
  today.getDate().toString().padStart(2, '0')
];
const dateStr2 = `${dateArr.join('-')}`;
console.log(dateStr2);  // 輸出當前日期的年-月-日格式（帶前導零）

// 方法3：使用字元串模板和replace方法格式化日期
const strTemplate = '現在是{year}年{month}月{day}日';
const replaceTemplate = str => str
  .replace(/{year}/, today.getFullYear())
  .replace(/{month}/, (today.getMonth() + 1).toString().padStart(2, '0'))
  .replace(/{day}/, today.getDate().toString().padStart(2, '0'));
const dateStr3 = replaceTemplate(strTemplate);
console.log(dateStr3);  // 輸出格式化後的日期字元串