文档/教程前端【免费下载链接】en.javascript.infoModern JavaScript Tutorial项目地址https://gitcode.com/gh_mirrors/en/en.javascript.info点击查看免费下载本篇文章围绕 en.javascript.info 仓库中《Date and time》章节的经典练习题getSecondsToday()题目与官方解答展开系统讲解如何基于 JavaScript 内置的Date对象计算从当天 00:00:00 到现在已经过去的秒数。读完本文你将掌握两种官方推荐的实现思路——时间差法与时分秒直接换算法理解Date转数值、日期相减、Math.round等底层机制并学会将该方案推广到距离明天还剩多少秒等同类场景。任务目标返回今天已流逝的秒数原练习要求编写一个函数getSecondsToday()返回从今天当天 00:00:00开始到现在已经过去的秒数例如当前时刻是10:00 am且当天没有夏令时DST偏移则getSecondsToday() 36000 // (3600 * 10)函数必须在任何一天都能工作即不能把今天硬编码成固定日期。这个函数在真实项目中非常实用例如统计用户当天在线时长、生成今日已过百分比的进度条、按天滚动日志的分段计时等。方案一时间差法构造今日零点再做日期相减这是官方解答给出的第一种思路先构造一个代表今天 00:00:00的Date对象再用now - today得到从零点到现在的毫秒差最后除以 1000 得到秒数function getSecondsToday() { let now new Date(); // 使用当前的年/月/日构造今天零点的 Date 对象 let today new Date(now.getFullYear(), now.getMonth(), now.getDate()); let diff now - today; // 毫秒差 return Math.round(diff / 1000); // 转换为秒 } alert( getSecondsToday() );底层原理拆解1. 用分量构造今日零点new Date(year, month, date, hours, minutes, seconds, ms)是Date的本地时区构造形式只有前两个参数是必需的。当hours/minutes/seconds/ms缺省时默认全部为0详见 Date and time 章节new Date(2011, 0, 1, 0, 0, 0, 0); // 1 Jan 2011, 00:00:00 new Date(2011, 0, 1); // 等价小时等默认是 0因此new Date(now.getFullYear(), now.getMonth(), now.getDate())就得到了本地时区的今天零点而不是 UTC 零点——这正是我们想要的语义。2.now - today为什么是毫秒差Date对象在参与数值运算减法、一元时会被自动转换为时间戳timestamp即从 1970-01-01 00:00:00 UTC 起的毫秒数等价于date.getTime()let date new Date(); alert(date); // 毫秒数与 date.getTime() 相同日期可以直接相减结果是毫秒差是Date的重要特性本文任务正是利用这一点计算now - today。3. 为什么用Math.round而不是Math.floordiff / 1000可能产生小数例如10:00:00.500时刻diff 为 36000500 毫秒除以 1000 得 36000.5Math.round四舍五入得到整数秒避免输出带小数的结果。这与同章节练习getSecondsToTomorrow()的官方解答保持一致的取舍。方案二时分秒直接换算避免构造 Date 对象官方解答给出的第二种思路更轻量直接读取当前的小时、分钟、秒换算成从零点起经过的总秒数function getSecondsToday() { let d new Date(); return d.getHours() * 3600 d.getMinutes() * 60 d.getSeconds(); } alert( getSecondsToday() );其中getHours()返回本地时区的小时023getMinutes()返回分钟059getSeconds()返回秒059换算关系小时 × 3600 分钟 × 60 秒。这套getHours()/getMinutes()/getSeconds()组件访问方法都返回本地时区下的分量Date还提供对应的getUTCHours()等 UTC 变体见 article.md。此方案不涉及构造第二个Date对象也不依赖日期相减逻辑更直白。两种方案对比何时选哪种维度方案一时间差法方案二时分秒换算思路构造今日零点 Datenow - today取毫秒差读取时分秒分量直接累加涉及 APIgetFullYear/getMonth/getDate、日期减法、Math.roundgetHours/getMinutes/getSeconds是否创建第二个 Date是today否代码量略长最精简可读性语义从零点到现在的时间差更直观公式直白几乎无解释成本两者都能在任何一天正确工作。从可维护性看方案一的写法对今天零点这一概念的表达更显式也更容易向明天零点getSecondsToTomorrow等变体推广从执行开销看方案二少创建了一个Date对象。实际项目可按团队风格取舍。边界情况与注意事项夏令时DST与 23/25 小时的特殊日两种方案都假设一天恒为 86400 秒。但在实行夏令时的国家可能存在 23 小时或 25 小时的特殊日子。相邻练习getSecondsToTomorrow()的官方解答明确指出很多国家有 DST当天可能是 23 或 25 小时若业务对这类日子敏感应单独处理。从实现细节看方案一基于Date相减天然反映真实经过的毫秒数DST 切换时零点与现在的实际差可能不等于 86400 秒的整数倍方案二则假设满 86400 秒。若必须精确到墙上时钟语义如今天还剩多少秒可用于登录方案二更符合直觉若要反映真实流逝的物理时间方案一更准确。精度与毫秒Date的最大精度是 1 毫秒new Date(2011, 0, 1, 2, 3, 4, 567)可表示 567ms。两方案中方案一在Math.round前保留了毫秒精度方案二天然是整秒结果。若需要毫秒级统计如当日已过毫秒数可改为return diff;或将方案二改为d.getMilliseconds()一起累加。扩展到同类练习距离明天还剩多少秒同一章节的姊妹练习 getSecondsToTomorrow题目要求返回距离明天零点的秒数官方给出了与方案一同构的实现function getSecondsToTomorrow() { let now new Date(); // 明天日期直接在当前日期上加 1 天 let tomorrow new Date(now.getFullYear(), now.getMonth(), now.getDate() 1); let diff tomorrow - now; // 毫秒差 return Math.round(diff / 1000); // 转换为秒 }注意这里把now.getDate() 1直接传给构造函数——即使跨月、跨年如 1 月 31 日 1 2 月 1 日Date的**自动修正autocorrection**机制也会自动调整详见 article.md。同章节的 getLastDayOfMonth 练习还利用了day 传 0 代表上个月最后一天的自动修正特性可见构造零点 日期运算是该章节反复出现的经典模式。如何验证你的实现本仓库的练习目录通常配有 Mocha 测试用例如_js.view/test.js例如 2-get-week-day 的测试用assert.equal对固定日期断言8-format-date-relative 的测试则通过new Date(new Date - 30 * 1000)构造相对时间断言。受今天已过秒数随时间动态变化所限该练习本身没有静态快照测试可参考同目录测试风格用如下方式做边界验证// 1) 构造一个已知时刻模拟 10:00:00 let mockNow new Date(); mockNow.setHours(10, 0, 0, 0); let expected 10 * 3600; // 36000 // 2) 验证今天零点的构造正确性 let today new Date(mockNow.getFullYear(), mockNow.getMonth(), mockNow.getDate()); console.assert(today.getHours() 0 today.getMinutes() 0); // 3) 验证方案二换算公式 console.assert(mockNow.getHours() * 3600 mockNow.getMinutes() * 60 mockNow.getSeconds() expected);将以上代码粘贴到浏览器控制台或 Node.js 中即可运行在教程在线沙箱中alert( getSecondsToday() )会直接弹出结果。结合 Date and time 全章对构造、访问、设置、自动修正、Date.now()的完整讲解你还可以把今日已过秒数进一步推广为今日进度百分比距离明天剩余秒数等生产级时间工具。赞分享文档/教程前端【免费下载链接】en.javascript.infoModern JavaScript Tutorial项目地址https://gitcode.com/gh_mirrors/en/en.javascript.info点击查看免费下载相关推荐JavaScript 计算器对象实战用 Object Methods 与 this 实现可交互的 calculatorModern JavaScript TutorialJavaScript 计算器对象实战用 Object Methods 与 this 实现可交互的 calculatorModern JavaScript T文档/教程前端Slate v2 生产级安全 DOM 错误策略重构指南严格 Helper 与可空 Helper 双轨 API 设计Slate v2 生产级安全 DOM 错误策略重构指南严格 Helper 与可空 Helper 双轨 API 设计 本文是一份面向 Slate v2以及其上文档/教程前端JavaScript 对象方法与 this 关键字详解Modern JavaScript Tutorial 实战篇JavaScript 对象方法与 this 关键字详解Modern JavaScript Tutorial 实战篇 导读 在 JavaScript 中对象文档/教程前端上一篇完整指南华硕路由器装好 AdGuardHome全家设备广告拦一遍下一篇Audacity 多轨音频编辑器免费录音与剪辑的新手完整指南创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考