JavaScript中获取可用时区名称列表-html教程-PHP中文网

JavaScript中获取可用时区名称列表

DDD

发布： 2025-10-31 12:01:15

原创

662人浏览过

JavaScript中获取可用时区名称列表

本教程将介绍如何在javascript环境中获取一个标准的时区名称列表。针对从moment.js迁移到day.js后寻找时区列表方法的场景，我们将利用web api `intl.supportedvaluesof('timezone')` 提供一个无需外部库的解决方案，并详细说明其使用方法、输出格式及相关注意事项。

在开发涉及全球用户的应用程序时，经常需要提供一个时区选择器，或者根据用户所在时区显示时间。以往，一些流行的日期时间处理库如Moment.js提供了直接获取时区列表的功能。然而，当开发者转向更轻量级的库如Day.js时，可能会发现此类功能并非直接集成在核心库中。本文将介绍一种现代、标准且无需额外依赖的JavaScript方法来获取可用的时区名称列表。

使用 Intl.supportedValuesOf 获取时区列表

JavaScript的Intl对象提供了对国际化API的访问，其中包括了获取本地化相关信息的强大功能。Intl.supportedValuesOf()方法是其中一个非常有用的API，它允许我们查询给定类别的可用值。对于时区，我们可以使用'timeZone'作为参数来获取一个标准的时区名称列表。

以下代码展示了如何在浏览器控制台或其他JavaScript环境中执行此操作：

/**
 * 获取所有支持的时区名称列表
 * @returns {string[]} 一个包含所有IANA时区名称的数组
 */
function getTimeZoneNameList() {
  // 使用Intl.supportedValuesOf('timeZone')获取标准时区名称列表
  const timeZones = Intl.supportedValuesOf('timeZone');
  return timeZones;
}

// 在控制台打印所有时区名称
const zoneList = getTimeZoneNameList();
console.log("支持的时区名称列表：");
zoneList.forEach(zone => console.log(zone));

// 如果需要一个更紧凑的列表，可以根据需求进行过滤或分组
// 例如，只获取包含特定地区的时区
const specificRegions = zoneList.filter(zone => 
  zone.startsWith('America/') || zone.startsWith('Europe/')
);
console.log("\n部分地区时区示例：");
specificRegions.forEach(zone => console.log(zone));

登录后复制

代码解析：

立即学习“Java免费学习笔记（深入）”；

Intl.supportedValuesOf('timeZone') 方法会返回一个字符串数组，其中每个字符串都代表一个标准的时区名称。
这些时区名称遵循 IANA 时区数据库命名约定（例如："America/New_York", "Europe/London", "Asia/Shanghai"）。
此方法是浏览器原生的Web API，因此不需要引入任何第三方库即可使用。

输出格式与特点

Intl.supportedValuesOf('timeZone') 返回的列表包含了全球所有标准时区的完整名称。这些名称是唯一的，并且能够准确地表示一个地理区域及其所有历史和未来的夏令时（DST）规则。

讯飞智作-讯飞配音

讯飞智作是一款集AI配音、虚拟人视频生成、PPT生成视频、虚拟人定制等多功能的AI音视频生产平台。已广泛应用于媒体、教育、短视频等领域。

查看详情

完整性： 列表非常全面，涵盖了全球范围内的所有主要时区。
标准化： 采用的是国际上公认的IANA时区数据库命名规范。
包含夏冬时制： 每个时区名称都隐式包含了其所在地区的夏令时（或冬令时）转换规则，无需额外处理。当使用这些名称配合日期时间库（如Day.js的dayjs-timezone插件）进行时间转换时，库会自动处理夏令时。
非紧凑性： 原始列表可能包含数百个条目，对于某些应用场景可能显得过于冗长。用户可以根据实际需求对这个列表进行过滤或分组，例如只显示特定大陆或国家/地区的时区。

优势与注意事项

原生Web API，无需依赖： 最大的优势在于它是浏览器内置的功能，不需要安装任何额外的JavaScript库或插件。这有助于减小项目体积，并减少潜在的依赖冲突。
自动更新，包含夏冬时制： 浏览器或运行时环境会负责维护和更新其内部的时区数据。这意味着开发者无需手动更新时区数据，并且列表中的每个时区名称都已考虑了其对应的夏令时（DST）规则。
浏览器兼容性： Intl.supportedValuesOf 是一个相对较新的API（ES2020），但在现代浏览器（如Chrome 79+, Firefox 74+, Safari 13.1+, Edge 79+）中已得到广泛支持。在旧版浏览器中可能需要Polyfill。
与Day.js的关系： 值得注意的是，Day.js核心库本身并没有提供获取时区列表的功能。它主要专注于日期时间的解析、格式化和操作。如果你需要Day.js来处理特定时区的时间，通常会结合其官方的 dayjs-timezone 插件。Intl.supportedValuesOf('timeZone') 提供的时区名称列表，可以完美地作为 dayjs-timezone 插件的输入。例如：
```
// 假设你已经安装并加载了 dayjs 和 dayjs-timezone 插件
// import dayjs from 'dayjs';
// import utc from 'dayjs/plugin/utc';
// import timezone from 'dayjs/plugin/timezone';

// dayjs.extend(utc);
// dayjs.extend(timezone);

const newYorkTimeZone = 'America/New_York';
const nowInNewYork = dayjs().tz(newYorkTimeZone);
console.log(`纽约当前时间：${nowInNewYork.format('YYYY-MM-DD HH:mm:ss Z')}`);
```
登录后复制

总结

尽管从Moment.js切换到Day.js后，直接获取时区列表的方式有所不同，但JavaScript提供了强大且原生的Intl.supportedValuesOf('timeZone')方法来解决这一问题。这个API不仅提供了完整的、标准化的时区名称列表，而且无需任何第三方依赖，并能自动处理夏令时规则。开发者可以利用此方法获取时区列表，并根据实际需求进行筛选和展示，再结合Day.js等日期时间库进行精确的时区时间处理。

以上就是JavaScript中获取可用时区名称列表的详细内容，更多请关注php中文网其它相关文章！