内置 Temporal Polyfill
演练场自动加载 @js-temporal/polyfill,确保在所有现代浏览器中都能运行 Temporal 代码。Polyfill 体积约 50KB(gzip),API 与 TC39 规范完全一致。当浏览器原生支持 Temporal 时,会自动切换到原生实现,代码无需修改。这意味着开发者可以在当前环境中提前体验 Temporal 的完整功能,为未来的浏览器原生支持做好准备。
日期基础实验
内置「今日与下周」「获取月份天数」「判断闰年」三种日期基础预设。通过这些预设可以快速了解 Temporal.Now.plainDateISO() 获取当前日期、plainDate.add() 日期加减运算、plainDate.daysInMonth 获取月份天数、Temporal.Calendar 判断闰年等核心用法。这些是最常用的日期操作场景,也是从 Date 迁移到 Temporal 的第一步。
时间操作实验
内置「当前时间与取整」「时间加减运算」「计算时间间隔」三种时间操作预设。展示 Temporal.Now.plainDateTimeISO() 获取当前日期时间、plainTime.add() 时间加减、plainDateTime.until() 计算时间间隔等用法。特别是 Duration 的 total() 方法,可以将时间段转换为指定单位的浮点数总和,这在计算总时长和生成图表数据时非常实用。
时区处理实验
内置「当前时区日期时间」「纽约到东京时区转换」两种时区预设。展示 ZonedDateTime 的原生时区支持——使用 IANA 时区数据库(如 America/New_York、Asia/Tokyo),自动处理夏令时转换。时区转换是 Temporal 相比 Date 的重大改进之一,Date 对象完全没有时区概念,而 ZonedDateTime 可以正确表示不同时区的同一时刻。
时间段计算实验
内置「Duration 单位换算」「计算日期差距」两种时间段预设。展示 Duration 对象的创建和使用——可以表示年、月、周、日、时、分、秒、纳秒等时间单位的组合。通过 duration.total() 将 Duration 转换为指定单位的数值,通过 plainDate.until() 计算两个日期之间的 Duration 差距。这些功能在日程计算、倒计时、时间统计等场景中非常实用。
比较与排序实验
内置「日期数组排序」「比较两个日期」两种比较预设。展示 Temporal 对象的内置比较能力——Temporal.PlainDate 和 Temporal.ZonedDateTime 都支持直接比较(使用 equals()、since()、until() 等方法),也可以通过 toLocaleString() 生成可排序的字符串表示。这在处理日程排序、时间线展示等场景中非常方便,无需手动编写比较函数。
格式化与实用工具
内置「中文格式化输出」「毫秒时间戳转日期」两种格式化预设。展示 Temporal 对象的 toLocaleString() 本地化格式化、toString() ISO 格式输出、epochMilliseconds 时间戳转换等实用功能。中文格式化演示了 Temporal 如何与 Intl.DateTimeFormat 配合实现本地化的日期时间显示。时间戳转换则展示了 Instant 类型与毫秒时间戳之间的互转。
UD5工具箱