我正在尝试寻找一个用户友好的时区列表，供用户选择他们当前所在的时区。它将包含常见的时区名称，比如太平洋时间（美国和加拿大）。
这个列表应该将文本映射到IANA标准名称，比如America/Los_Angeles。
它还应该移除用户认为是“相同”的时区列表。例如，太平洋时间（美国和加拿大）对应于America/Los_Angeles和America/Tijuana，它们是“相同”的时区。
我已经尝试查看IANA时区数据库，ECMA脚本国际化API和类库，如Moment.js。它们可以将IANA名称解析为通用名称，例如America/Los_Angeles ==> "Pacific Standard Time"，但没有内置函数列出所有通用名称及其相应的IANA名称。
Intl.DateTimeFormat.prototype.formatToParts()。new Intl.DateTimeFormat(
'default',
{ timeZone: 'America/Los_Angeles', timeZoneName: 'long' }
).formatToParts().find(({ type }) => type === 'timeZoneName').value
// 'Pacific Daylight Time'
let opts = {
hour: 'numeric',
minute:'2-digit',
timeZone: 'Pacific/Samoa',
timeZoneName: 'long'
};
let time = new Date().toLocaleString('en', opts);
console.log('Currently in Samoa it\'s ' + time);在最新版本的MacOS上，以上代码返回萨摩亚岛的UTC-1100偏移量，仍然使用旧的值，并且不识别夏令时，因此不能完全依赖Intl对象。
您可以像下面这样使用Intl对象，需要注意对于某些位置，它可能没有时区名称，只显示偏移量（例如尝试Europe/Astrakhan）。有近600个IANA位置可供选择。
// Detect user representative location if available
let repLoc = (typeof Intl == 'object' &&
typeof Intl.DateTimeFormat == 'function' &&
typeof Intl.DateTimeFormat().resolvedOptions == 'function')?
Intl.DateTimeFormat().resolvedOptions().timeZone : 'default';
function setRepLoc(evt) {
showSampleDates(this.value);
}
function showSampleDates(repLoc) {
let el0 = document.getElementById('sDate0');
let el1 = document.getElementById('sOff0');
let el2 = document.getElementById('sDate1');
let el3 = document.getElementById('sOff1');
let d0 = new Date(Date.UTC(2020,0,1,11));
let d1 = new Date(Date.UTC(2020,5,1,11));
let opts = {
weekday: 'short',
day: 'numeric',
month: 'short',
year: 'numeric',
hour: 'numeric',
minute: '2-digit',
timeZone: repLoc,
timeZoneName: 'long'
};
let offOpts = {
hour: 'numeric',
hour12: false,
timeZone: repLoc,
timeZoneName: 'short'
}
if (repLoc == 'default') {
el0.textContent = '';
el1.textContent = '';
el2.textContent = '';
el3.textContent = '';
} else {
el0.textContent = d0.toLocaleString('en-NZ', opts);
el1.textContent = d0.toLocaleString('en-NZ', offOpts).split(' ')[1];
el2.textContent = d1.toLocaleString('en-NZ', opts);
el3.textContent = d1.toLocaleString('en-NZ', offOpts).split(' ')[1];
}
}
window.onload = function(){
let sel = document.getElementById('repLoc')
if (repLoc) {
sel.options[0].text = repLoc;
sel.options[0].value = repLoc;
sel.selectedIndex = 0;
setRepLoc.call(sel);
}
sel.addEventListener(
'change',
setRepLoc,
false);
};td:nth-child(1){text-align:right;color:#999;}
td:nth-child(2){font-family:monospace}<table>
<tr>
<td>IANA loc:
<td><select id="repLoc">
<option selected value="default">Select a location
<option>Europe/Amsterdam
<option>Europe/Andorra
<option>Europe/Astrakhan
<option>Europe/Athens
<option>Europe/Belfast
<option>Pacific/Samoa
<option>Pacific/Kiritimati
<option>Antarctica/DumontDUrville
<option>Antarctica/Davis
<option>America/Chicago
<option>Australia/Brisbane
</select>
<tr>
<td>Sample:
<td id="sDate0">
<tr>
<td>Offset:
<td id="sOff0">
<tr>
<td>Sample:
<td id="sDate1">
<tr>
<td>Offset:
<td id="sOff1">
</table>在Kimamula的回答基础上，我使用了当前的IANA时区名称列表，并通过我的浏览器的Intl格式化程序获取了它们的长名称和短名称。结果是一个gist，其中包含IANA名称与人类可读名称的映射。我选择了这些名称的“通用”形式，省略了夏令时的提及。否则，我们需要知道是否实行夏令时来选择名称。(例如，Pacific Time而不是Pacific Standard Time或Pacific Daylight Time)。
并非所有时区在此数据库中都有理想的名称，像大多数与时间相关的事物一样，这将是一个不完美的解决方案。但它希望能涵盖您的用户最常使用的时区，并显示IANA名称作为备选项。
如果您想自己生成这些名称，可以在浏览器中运行此操作。这些名称来自Firefox，我猜它们是实现相关的，在其他浏览器中可能会有所不同。
const iana_names = [
"Africa/Abidjan",
"Africa/Accra",
"Africa/Addis_Ababa",
// ...
"W-SU",
"WET",
"Zulu"
]
const mapping = {}
iana_names.forEach( name => {
const long = new Intl.DateTimeFormat('default', { timeZone: name, timeZoneName: 'longGeneric' }).formatToParts().find(({ type }) => type === 'timeZoneName').value
const short = new Intl.DateTimeFormat('default', { timeZone: name, timeZoneName: 'shortGeneric' }).formatToParts().find(({ type }) => type === 'timeZoneName').value
mapping[name] = {
long, short
}
})