JS Date 对象转 YYYYMMDD 格式字符串的5种方法

2025-03-21 22:36:16

JS 日期对象转 YYYYMMDD 格式字符串的那些事儿

遇到了个挺常见的问题：要把 JavaScript 里的 Date 对象转成 YYYYMMDD 这种格式的字符串，有啥好办法？拼接 Date.getFullYear(), Date.getMonth(), 还有 Date.getDate() ？这也太麻烦了！

为什么老是遇到这个问题？

主要还是因为不同的地方，对日期的格式要求五花八门。有的系统要 YYYY-MM-DD，有的要 MM/DD/YYYY，还有的就爱 YYYYMMDD 这种紧凑型的。做数据处理、接口对接、文件名生成… 都可能碰上。

几种常见的搞法

下面我整理了几种把 Date 对象转换成 YYYYMMDD 格式字符串的方法，从简单到复杂都有，你可以根据自己的情况挑一个顺手的。

1. 手动拼接：最 “朴实” 的办法

就像一开始说的，可以分别获取年、月、日，然后拼起来：

function formatDate(date) {
  const year = date.getFullYear();
  const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份是从 0 开始的，所以要 +1，还要补零！
  const day = String(date.getDate()).padStart(2, '0'); // 日也要补零！

  return year + month + day;
}

const myDate = new Date();
const formattedDate = formatDate(myDate);
console.log(formattedDate); // 输出类似于 "20231027"

原理：

getFullYear()：直接拿到四位数的年份。
getMonth()：拿到月份，但是！月份是从 0 开始的（0 代表 1 月，11 代表 12 月），所以要加 1。
getDate()：拿到日期。
String().padStart(2, '0')：保证月和日都是两位数，不够的在前面补 0。比如，1 月会变成 "01"。

注意：

月份要记得加 1！这是个很容易犯错的地方。
用 padStart() 保证月、日是两位数，这很重要。

2. 使用 toISOString() + 字符串截取：省点事儿

toISOString() 方法可以把 Date 对象转成 ISO 8601 格式的字符串 (YYYY-MM-DDTHH:mm:ss.sssZ)。我们可以从中截取出我们需要的部分。

function formatDate(date) {
  return date.toISOString().split('T')[0].replace(/-/g, '');
}

const myDate = new Date();
const formattedDate = formatDate(myDate);
console.log(formattedDate);

原理：

toISOString(): 直接得到一个标准格式的字符串，比如 "2023-10-27T12:34:56.789Z"。
split('T')[0]: 以 'T' 为分隔符，把字符串切成两部分，我们要的是日期部分，所以取第一个元素，也就是 "2023-10-27"。
replace(/-/g, ''): 把 "-" 全部替换成空字符串，就得到了 "20231027"。

注意：

toISOString() 返回的是 UTC 时间。如果你需要的是本地时间，可能得再处理一下时区问题。

3. toLocaleDateString()：看当地习惯

toLocaleDateString() 可以根据本地设置（或者你指定的 locale）来格式化日期。但是，不同地区、不同浏览器的默认格式可能不一样，所以要得到 YYYYMMDD，得花点心思。

function formatDate(date) {
    const options = { year: 'numeric', month: '2-digit', day: '2-digit' };
  return date.toLocaleDateString(undefined, options).replace(/\D/g, "");
}

const myDate = new Date();
const formattedDate = formatDate(myDate);
console.log(formattedDate);

原理：

toLocaleDateString(undefined, options)：第一个参数是 locale。如果不提供, 就使用运行时的默认区域设置, 此时 options 就很有用了
options : 一个具有格式化选项的对象，用来精细地控制日期的格式：
* year: 'numeric'：年份用四位数表示。
* month: '2-digit'：月份用两位数表示 (如果是一位数就在前面补 0)。
* day: '2-digit'：日用两位数表示 (如果是一位数就在前面补 0)。
replace(/\D/g, ""): 移除非数字的字符。\D 匹配任何非数字字符, g标志用于替换所有匹配项, 而不仅仅是第一个

注意：

toLocaleDateString 返回的日期格式是多变的。在使用此方式的时候, 建议固定传入options，并根据输出进行进一步处理,保证输出YYYYMMDD格式。

4. 使用 Intl.DateTimeFormat：更强大的本地化

Intl.DateTimeFormat 对象是 ECMAScript 国际化 API 的一部分，它提供了更灵活的日期和时间格式化功能。

function formatDate(date) {
  const formatter = new Intl.DateTimeFormat('en-US', {
    year: 'numeric',
    month: '2-digit',
    day: '2-digit',
  });

  return formatter.format(date).replace(/\//g, '');
}
const myDate = new Date();
const formattedDate = formatDate(myDate);
console.log(formattedDate);

或者, 更简洁一些的写法, 直接通过formatToParts获得各部分然后组合

function formatDate(date) {
  const parts = new Intl.DateTimeFormat('fr-CA',{year: 'numeric', month: '2-digit',day: '2-digit'}).formatToParts(date);
  let formatted = '';
   for (let part of parts) {
        if (part.type === 'year' || part.type === 'month' || part.type === 'day') {
            formatted += part.value;
        }
    }
    return formatted;
}

const myDate = new Date();
const formattedDate = formatDate(myDate);
console.log(formattedDate);

原理：

new Intl.DateTimeFormat('en-US', { ... })：创建一个日期格式化器。第一个参数是 locale（这里用的是 'en-US'，你也可以换成别的），第二个参数是格式化选项。
formatter.format(date)：用格式化器来格式化日期对象。
replace(/\//g, '')：把斜杠替换掉(en-US 默认格式是 MM/DD/YYYY)。
formatToParts：返回一个数组，包含日期的各个组成部分（年、月、日、时、分、秒等），每个部分都是一个对象，包含了类型和值。

注意：

同样，为了输出稳定的YYYYMMDD格式, 需要对返回内容做处理.
formatToParts 是个好东西, 可以灵活组合出想要的格式.

5. 使用第三方库：Moment.js (不推荐) 和 Day.js/date-fns (推荐)

以前，Moment.js 很流行，但现在它官方都建议用别的库了。如果你真想用库，推荐 Day.js 或 date-fns，它们更轻量，功能也更现代。

Day.js 示例：

// 先安装： npm install dayjs

import dayjs from 'dayjs';

function formatDate(date) {
  return dayjs(date).format('YYYYMMDD');
}

const myDate = new Date();
const formattedDate = formatDate(myDate);
console.log(formattedDate);

date-fns 示例：

// 先安装： npm install date-fns

import { format } from 'date-fns';

function formatDate(date) {
  return format(date, 'yyyyMMdd');
}

const myDate = new Date();
const formattedDate = formatDate(myDate);
console.log(formattedDate);