Intl.DateTimeFormat

Baseline 已广泛支持

此功能已成熟,可跨多种设备和浏览器版本使用。自 2017 年 9 月以来,它已在浏览器中提供。

Intl.DateTimeFormat 对象支持进行语言敏感的日期和时间格式化。

试一试

const date = new Date(Date.UTC(2020, 11, 20, 3, 23, 16, 738));
// Results below assume UTC timezone - your results may vary

// Specify default date formatting for language (locale)
console.log(new Intl.DateTimeFormat("en-US").format(date));
// Expected output: "12/20/2020"

// Specify default date formatting for language with a fallback language (in this case Indonesian)
console.log(new Intl.DateTimeFormat(["ban", "id"]).format(date));
// Expected output: "20/12/2020"

// Specify date and time format using "style" options (i.e. full, long, medium, short)
console.log(
  new Intl.DateTimeFormat("en-GB", {
    dateStyle: "full",
    timeStyle: "long",
    timeZone: "Australia/Sydney",
  }).format(date),
);
// Expected output: "Sunday, 20 December 2020 at 14:23:16 GMT+11"

构造函数

Intl.DateTimeFormat()

创建一个新的 Intl.DateTimeFormat 对象。

静态方法

Intl.DateTimeFormat.supportedLocalesOf()

返回一个数组,其中包含提供的区域设置中受支持的那些区域设置,而无需回退到运行时默认区域设置。

实例属性

这些属性定义在 Intl.DateTimeFormat.prototype 上,并被所有 Intl.DateTimeFormat 实例共享。

Intl.DateTimeFormat.prototype.constructor

创建实例对象的构造函数。对于 Intl.DateTimeFormat 实例,初始值是 Intl.DateTimeFormat 构造函数。

Intl.DateTimeFormat.prototype[Symbol.toStringTag]

[Symbol.toStringTag] 属性的初始值是字符串 "Intl.DateTimeFormat"。此属性用于 Object.prototype.toString()

实例方法

Intl.DateTimeFormat.prototype.format()

用于根据此 DateTimeFormat 对象的语言环境和格式选项格式化日期的 getter 函数。

Intl.DateTimeFormat.prototype.formatRange()

此方法接收两个 Date 对象,并根据实例化 DateTimeFormat 时提供的语言环境和选项,以最简洁的方式格式化日期范围。

Intl.DateTimeFormat.prototype.formatRangeToParts()

此方法接收两个 Date 对象,并返回一个对象数组,其中包含表示格式化日期范围的每个部分的特定于语言环境的标记。

Intl.DateTimeFormat.prototype.formatToParts()

返回一个对象 Array,其中包含表示日期字符串的各个部分,可用于自定义的、符合语言环境的格式化。

Intl.DateTimeFormat.prototype.resolvedOptions()

返回一个新对象,其属性反映在对象初始化过程中计算出的语言环境和格式化选项。

示例

使用 DateTimeFormat

在不指定语言环境的基本用法中,DateTimeFormat 使用默认语言环境和默认选项。

js
const date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));

// toLocaleString without arguments depends on the implementation,
// the default locale, and the default time zone
console.log(new Intl.DateTimeFormat().format(date));
// "12/19/2012" if run with en-US locale (language) and time zone America/Los_Angeles (UTC-0800)

使用语言环境

本示例展示了本地化日期和时间格式的一些变化。为了获得应用程序用户界面中所用语言的格式,请确保使用 locales 参数指定该语言(以及可能的某些备用语言)。

js
const date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));

// Results below use the time zone of America/Los_Angeles (UTC-0800, Pacific Standard Time)

// US English uses month-day-year order
console.log(new Intl.DateTimeFormat("en-US").format(date));
// "12/19/2012"

// British English uses day-month-year order
console.log(new Intl.DateTimeFormat("en-GB").format(date));
// "19/12/2012"

// Korean uses year-month-day order
console.log(new Intl.DateTimeFormat("ko-KR").format(date));
// "2012. 12. 19."

// Arabic in most Arabic speaking countries uses real Arabic digits
console.log(new Intl.DateTimeFormat("ar-EG").format(date));
// "١٩‏/١٢‏/٢٠١٢"

// for Japanese, applications may want to use the Japanese calendar,
// where 2012 was the year 24 of the Heisei era
console.log(new Intl.DateTimeFormat("ja-JP-u-ca-japanese").format(date));
// "24/12/19"

// when requesting a language that may not be supported, such as
// Balinese, include a fallback language, in this case Indonesian
console.log(new Intl.DateTimeFormat(["ban", "id"]).format(date));
// "19/12/2012"

使用选项

日期和时间格式可以使用 options 参数进行自定义。

js
const date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0, 200));

// request a weekday along with a long date
let options = {
  weekday: "long",
  year: "numeric",
  month: "long",
  day: "numeric",
};
console.log(new Intl.DateTimeFormat("de-DE", options).format(date));
// "Donnerstag, 20. Dezember 2012"

// an application may want to use UTC and make that visible
options.timeZone = "UTC";
options.timeZoneName = "short";
console.log(new Intl.DateTimeFormat("en-US", options).format(date));
// "Thursday, December 20, 2012, GMT"

// sometimes you want to be more precise
options = {
  hour: "numeric",
  minute: "numeric",
  second: "numeric",
  timeZone: "Australia/Sydney",
  timeZoneName: "short",
};
console.log(new Intl.DateTimeFormat("en-AU", options).format(date));
// "2:00:00 pm AEDT"

// sometimes you want to be very precise
options.fractionalSecondDigits = 3; // number digits for fraction-of-seconds
console.log(new Intl.DateTimeFormat("en-AU", options).format(date));
// "2:00:00.200 pm AEDT"

// sometimes even the US needs 24-hour time
options = {
  year: "numeric",
  month: "numeric",
  day: "numeric",
  hour: "numeric",
  minute: "numeric",
  second: "numeric",
  hour12: false,
  timeZone: "America/Los_Angeles",
};
console.log(new Intl.DateTimeFormat("en-US", options).format(date));
// "12/19/2012, 19:00:00"

// to specify options but use the browser's default locale, use undefined
console.log(new Intl.DateTimeFormat(undefined, options).format(date));
// "12/19/2012, 19:00:00"

// sometimes it's helpful to include the period of the day
options = { hour: "numeric", dayPeriod: "short" };
console.log(new Intl.DateTimeFormat("en-US", options).format(date));
// 10 at night

使用的日历和数字格式也可以通过 options 参数独立设置。

js
const options = { calendar: "chinese", numberingSystem: "arab" };
const dateFormat = new Intl.DateTimeFormat(undefined, options);
const usedOptions = dateFormat.resolvedOptions();

console.log(usedOptions.calendar);
// "chinese"

console.log(usedOptions.numberingSystem);
// "arab"

console.log(usedOptions.timeZone);
// "America/New_York" (the users default timezone)

规范

规范
ECMAScript® 2026 国际化 API 规范
# datetimeformat-objects

浏览器兼容性

另见