一、引言
世界时钟（World Clock）是一个多时区时间查看器，在全球化越来越普遍的今天，无论是商务合作、跨国旅行还是远程办公，了解不同城市的当前时间都是一项刚需功能。

技术角度来看，世界时钟的构建涉及：UTC 时区偏移计算、实时时钟刷新（每秒更新）、列表组件与数据类型的结合使用。

二、时区基础与 UTC 时间
2.1 什么是 UTC
UTC（Coordinated Universal Time，协调世界时）是全球时间计量的基准。每个时区都可以表示为 UTC 偏移量：

城市 UTC 偏移 与北京时间差
北京 UTC+8 0
伦敦 UTC+0 晚 8 小时
纽约 UTC-5 晚 13 小时
东京 UTC+9 早 1 小时
2.2 时区时间计算公式
目标城市时间 = UTC时间 + 城市偏移量
而 UTC 时间可以通过当前本地时间和本地时区偏移计算得到：

let utc = now.getTime() + (now.getTimezoneOffset() * 60000);
getTimezoneOffset() 返回的是本地时间与 UTC 的差值（以分钟为单位），乘以 60000 转为毫秒。

完整公式：

getCityTime(offset: number): string {
let utc = this.currentTime.getTime() +
(this.currentTime.getTimezoneOffset() * 60000);
let cityTime = new Date(utc + (3600000 * offset));
let h = cityTime.getHours();
let m = cityTime.getMinutes();
let s = cityTime.getSeconds();
return ${h < 10 ? '0' : ''}${h}:${m < 10 ? '0' : ''}${m}:${s < 10 ? '0' : ''}${s};
}
三、数据模型
3.1 城市时间数据结构
interface CityTime {
city: string; // 城市名（中文）
offset: number; // UTC 偏移量（小时）
emoji: string; // 国旗 emoji
}
3.2 城市列表
private cities: CityTime[] = [
{ city: ‘北京’, offset: 8, emoji: ‘🇨🇳’ },
{ city: ‘东京’, offset: 9, emoji: ‘🇯🇵’ },
{ city: ‘伦敦’, offset: 0, emoji: ‘🇬🇧’ },
{ city: ‘纽约’, offset: -5, emoji: ‘🇺🇸’ },
// …更多城市
];
四、实时刷新
4.1 每秒更新
aboutToAppear() {
this.timerId = setInterval(() => {
this.currentTime = new Date();
}, 1000);
}

aboutToDisappear() {
clearInterval(this.timerId);
}
在 aboutToAppear（组件挂载后）启动定时器，在 aboutToDisappear（组件卸载前）清除定时器。每次定时器触发时，更新 currentTime 变量，触发所有城市时间的重新计算与 UI 刷新。

4.2 每个城市的渲染
ListItem() {
Row({ space: 12 }) {
Text(ct.emoji).fontSize(28)
Column() {
Text(ct.city).fontSize(16)
Text(‘UTC’ + (ct.offset >= 0 ? ‘+’ : ‘’) + ct.offset).fontSize(12)
}
Blank()
Text(this.getCityTime(ct.offset)).fontSize(22).fontColor(‘#9B59B6’)
}
}
每座城市显示国旗、城市名、UTC 偏移和当前时间。Blank() 将时间和城市信息推到两端对齐。

五、性能考量
每秒刷新 12 个城市的时间看似简单，但需要注意：每次 currentTime 更新都会触发 12 条城市信息的重渲染。对于这种实时性要求高的场景，ArkTS 的响应式系统会自动优化渲染范围，只更新发生了变化的 Text 节点。

六、总结
世界时钟是一个"小而精"的实用工具。技术层面，它向我们展示了：

UTC 时区计算的数学原理
setInterval 在实时场景中的应用
组件生命周期管理的重要性
列表渲染与实时数据的结合
时区处理是计算机系统中的一个经典难题。理解 UTC 和时区偏移的关系，不仅能帮助我们开发世界时钟这样的工具，也是理解分布式系统时间同步的基础。