Intl.dateTimeFormat.formatToParts
Intl.dateTimeFormat.formatToParts
这是一项实验技术
由于该技术的规格不稳定,请查看各种浏览器的兼容性表格以供使用。另外请注意,随着规范的变化,实验技术的语法和行为在未来版本的浏览器中可能会发生变化。
该Intl.DateTimeFormat.prototype.formatToParts()
方法允许由DateTimeFormat
格式化程序生成的字符串的格式。
句法
Intl.DateTimeFormat.prototype.formatToParts(date)
参数
date
可选要格式化的日期。
返回值
一个Array
包含部分格式化的日期。
描述
该formatToParts()
方法对日期字符串的自定义格式非常有用。它返回Array
包含特定于语言环境的标记的对象,从中可以构建自定义字符串,同时保留特定于语言环境的部分。formatToParts()
方法返回的结构如下所示:
[
{ type: 'day', value: '17' },
{ type: 'weekday', value 'Monday' }
]
可能的类型如下:
day用于当天的字符串,例如“17”。
例子
DateTimeFormat
输出本地化,内部的字符串不能被直接操作:
var date = Date.UTC(2012, 11, 17, 3, 0, 42
var formatter = new Intl.DateTimeFormat('en-us', {
weekday: 'long',
year: 'numeric',
month: 'numeric',
day: 'numeric',
hour: 'numeric',
minute: 'numeric',
second: 'numeric',
hour12: true,
timeZone: 'UTC'
}
formatter.format(date
// "Monday, 12/17/2012, 3:00:42 AM"
但是,在许多用户界面中,需要定制该字符串的格式。该formatToParts
方法DateTimeFormat
通过为您提供部分字符串来启用由格式化器生成的字符串:
formatter.formatToParts(date
// return value:
[
{ type: 'weekday', value: 'Monday' },
{ type: 'literal', value: ', ' },
{ type: 'month', value: '12' },
{ type: 'literal', value: '/' },
{ type: 'day', value: '17' },
{ type: 'literal', value: '/' },
{ type: 'year', value: '2012' },
{ type: 'literal', value: ', ' },
{ type: 'hour', value: '3' },
{ type: 'literal', value: ':' },
{ type: 'minute', value: '00' },
{ type: 'literal', value: ':' },
{ type: 'second', value: '42' },
{ type: 'literal', value: ' ' },
{ type: 'dayPeriod', value: 'AM' }
]
现在信息可以单独使用,并且可以以定制的方式再次格式化和连接。例如通过使用Array.prototype.map(),
arrow functions,switch语句,模板和Array.prototype.reduce()
。
var dateString = formatter.formatToParts(date).map({type, value}) => {
switch (type) {
case 'dayPeriod': return `<strong>${value}</strong>`;
default : return value;
}
}).reduce((string, part) => string + part
在使用该formatToParts()
方法时,这将使得data更加突出。
console.log(formatter.format(date)
// "Monday, 12/17/2012, 3:00:42 AM"
console.log(dateString
// "Monday, 12/17/2012, 3:00:42 <strong>AM</strong>"
补充
提案库中提供了此功能的一些补充。
产品规格
Specification | Status | Comment |
---|---|---|
ECMAScript Internationalization API 4.0 (ECMA-402)The definition of 'Intl.DateTimeFormat.prototype.formatToParts' in that specification. | Draft | Initial definition |
浏览器兼容性
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | No support1 | 51.0 (51.0) | No support | No support | No support |
Feature | Android | Chrome for Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | No support | No support | 56.0 (56.0) | No support | No support | No support |