Intl.DateTimeFormat.prototype.formatRangeToParts()
formatRangeToParts() 方法是 Intl.DateTimeFormat 例項的一個方法，它返回一個物件陣列，這些物件表示由 formatRange() 返回的格式化字串中的每個部分。這對於根據本地化令牌構建自定義字串非常有用。
試一試
const startDate = new Date(Date.UTC(2007, 0, 10, 10, 0, 0)); // > 'Wed, 10 Jan 2007 10:00:00 GMT'
const endDate = new Date(Date.UTC(2007, 0, 10, 11, 0, 0)); // > 'Wed, 10 Jan 2007 11:00:00 GMT'
const dateTimeFormat = new Intl.DateTimeFormat("en", {
hour: "numeric",
minute: "numeric",
});
const parts = dateTimeFormat.formatRangeToParts(startDate, endDate);
for (const part of parts) {
console.log(part);
}
// Expected output (in GMT timezone):
// Object { type: "hour", value: "2", source: "startRange" }
// Object { type: "literal", value: ":", source: "startRange" }
// Object { type: "minute", value: "00", source: "startRange" }
// Object { type: "literal", value: " – ", source: "shared" }
// Object { type: "hour", value: "3", source: "endRange" }
// Object { type: "literal", value: ":", source: "endRange" }
// Object { type: "minute", value: "00", source: "endRange" }
// Object { type: "literal", value: " ", source: "shared" }
// Object { type: "dayPeriod", value: "AM", source: "shared" }
語法
formatRangeToParts(startDate, endDate)
引數
startDate-
日期範圍的開始。可以是
Date或Temporal.PlainDateTime物件。此外，如果DateTimeFormat物件被配置為列印至少一個相關的日期部分，它也可以是Temporal.PlainTime、Temporal.PlainDate、Temporal.PlainYearMonth或Temporal.PlainMonthDay物件。注意：
Temporal.ZonedDateTime物件總是會丟擲TypeError；請使用Temporal.ZonedDateTime.prototype.toLocaleString()或將其轉換為Temporal.PlainDateTime物件。 endDate-
日期範圍的結束。必須與
startDate的型別相同。
返回值
一個包含格式化日期範圍（按部分）的 Array。每個物件有三個屬性：type、value 和 source，每個屬性都包含一個字串。按順序連線 value 字串將產生與 formatRange() 相同的字串。type 可以具有與 formatToParts() 相同的值。source 可以是以下之一：
startRange-
該令牌是開始日期的一部分。
endRange-
該令牌是結束日期的一部分。
-
該令牌在開始和結束日期之間共享；例如，如果開始和結束日期共享相同的 day period，該令牌可能會被重用。所有屬於範圍模式本身的字面量，例如
" – "分隔符，也被標記為shared。
如果開始日期和結束日期在輸出精度上是等效的，那麼輸出將具有與對開始日期呼叫 formatToParts() 相同的令牌列表，所有令牌都標記為 source: "shared"。
示例
使用 formatRangeToParts()
formatRange() 方法輸出本地化的、不透明的字串，這些字串無法直接操作
const date1 = new Date(Date.UTC(1906, 0, 10, 10, 0, 0)); // Wed, 10 Jan 1906 10:00:00 GMT
const date2 = new Date(Date.UTC(1906, 0, 10, 11, 0, 0)); // Wed, 10 Jan 1906 11:00:00 GMT
const fmt = new Intl.DateTimeFormat("en", {
hour: "numeric",
minute: "numeric",
});
console.log(fmt.formatRange(date1, date2)); // '10:00 – 11:00 AM'
然而，在許多使用者介面中，您可能希望自定義此字串的格式，或者將其與其他文字交錯。formatRangeToParts() 方法以部分形式生成相同的資訊
console.log(fmt.formatRangeToParts(date1, date2));
// return value:
[
{ type: "hour", value: "10", source: "startRange" },
{ type: "literal", value: ":", source: "startRange" },
{ type: "minute", value: "00", source: "startRange" },
{ type: "literal", value: " – ", source: "shared" },
{ type: "hour", value: "11", source: "endRange" },
{ type: "literal", value: ":", source: "endRange" },
{ type: "minute", value: "00", source: "endRange" },
{ type: "literal", value: " ", source: "shared" },
{ type: "dayPeriod", value: "AM", source: "shared" },
];
規範
| 規範 |
|---|
| ECMAScript® 2026 國際化 API 規範 # sec-Intl.DateTimeFormat.prototype.formatRangeToParts |
瀏覽器相容性
載入中…