What are the differences between the hourCycle options in Date.prototype.toLocaleTimeString()

喜夏-厌秋 提交于 2021-01-27 07:53:34

问题


MDN documentation for toLocaleTimeString() indicates that the hourCycle and hc options have four possible values: "h11", "h12", "h23", & "h24".

Two of the possible values strike me as super obvious (i.e. "h12" and "h24"), but the other two, I have no idea what they do and my duckduckfoo/googlefoo is failing me!

What are the "h11" and "h23" values representing?

My best guess is that they are some type of 0 vs 1 derivations of "h12" and "h24", but the underlying date stamp is still the same, and the value logged is the same, so if this is it, where is the difference?

This should be documented, or at least linked to, on MDN's toLocalTimeString page or ECMAScript's toLocalTimeString page, but it's not. It also really strikes me as something that should be simple to figure out, and yet I’m not seeing the difference, and it’s now crawling under my skin!

const now = new Date();
console.log('hourCycle: h11', now.toLocaleTimeString('en-US', { hourCycle: 'h11' }))
console.log('hourCycle: h12', now.toLocaleTimeString('en-US', { hourCycle: 'h12' }))
console.log('hourCycle: h23', now.toLocaleTimeString('en-US', { hourCycle: 'h23' }))
console.log('hourCycle: h24', now.toLocaleTimeString('en-US', { hourCycle: 'h24' }))

回答1:


I found that the proposal of dateStyle and timeStyle options for Intl.DateTimeFormat says:

[[HourCycle]] is a String value indicating whether the 12-hour format ("h11", "h12") or the 24-hour format ("h23", "h24") should be used. "h11" and "h23" start with hour 0 and go up to 11 and 23 respectively. "h12" and "h24" start with hour 1 and go up to 12 and 24. [[HourCycle]] is only used when [[Hour]] is not undefined.

English or US style may prefer h12:

› new Date(2019,4,1,12,0,0).toLocaleString('en-US', { hourCycle: 'h12' })
‹ "5/1/2019, 12:00:00 PM"
› new Date(2019,4,1,12,0,0).toLocaleString('en-US', { hourCycle: 'h11' })
‹ "5/1/2019, 0:00:00 PM"

h24 must be used with caution. It would have been nice if the date part was the value one day before.

› new Date(2019,4,1,0,59,59).toLocaleString('ja-JP', { hourCycle: 'h23' })
‹ "2019/5/1 0:59:59"
› new Date(2019,4,1,0,59,59).toLocaleString('ja-JP', { hourCycle: 'h24' })
‹ "2019/5/1 24:59:59"

Compatibility table in MDN says Firefox 58 and Edge supports this.




回答2:


I agree it's currently difficult to find MDN's documentation on hourCycle values, but I found them here:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Locale/hourCycle

Web technology for developers > JavaScript > JavaScript reference > Standard built-in objects > Intl.Locale > Intl.Locale.prototype.hourCycle

[…]

h12: Hour system using 1–12; corresponds to 'h' in patterns. The 12 hour clock, with midnight starting at 12:00 am.

h23: Hour system using 0–23; corresponds to 'H' in patterns. The 24 hour clock, with midnight starting at 0:00.

h11: Hour system using 0–11; corresponds to 'K' in patterns. The 12 hour clock, with midnight starting at 0:00 am.

h24: Hour system using 1–24; corresponds to 'k' in pattern. The 24 hour clock, with midnight starting at 24:00.



来源:https://stackoverflow.com/questions/54258401/what-are-the-differences-between-the-hourcycle-options-in-date-prototype-tolocal

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!