如何在JavaScript中获取当前日期:新手完全指南

面向初学者的在线Python训练器

轻松学习Python,无需理论负担。在浏览器中直接解决带自动检查的实践任务,无需安装任何东西。

开始课程

如何在JavaScript中获取当前日期:解析Stack Overflow上的热门问题



如果您刚刚开始您的Web开发之旅,迟早会面临一个任务:在页面上显示当前日期。看起来很简单,对吧?但是,正如Stack Overflow的统计数据所示,问题"How do I get the current date in JavaScript?"每个月都会获得数千次浏览。为什么?因为在这个简单的表述背后,隐藏着一系列细微差别:从输出格式到时区处理。



在本文中,我们不仅会提供现成的代码。我们将逐行剖析它,学习如何控制格式,并避免新手常犯的典型错误。开始吧!



认识一下:Date对象——您的主要工具



在JavaScript中,没有专门的“显示今天”的命令。相反,该语言提供了一个强大但有时棘手的对象Date。要获取当前时间点,只需创建一个不带参数的新实例:



const now = new Date();console.log(now); // 输出:Tue Oct 15 2024 14:30:00 GMT+0300


就这么简单!但让我们看看我们实际上得到了什么。在控制台中,您会看到类似Tue Oct 15 2024 14:30:00 GMT+0300的内容。这是人类可读的格式,但并不总是适合实际任务。假设您正在开发一个在线商店,并希望将订单日期显示为“15.10.2024”——这种“原生”输出就不合适了。



关键在于,Date对象存储的是自1970年1月1日(Unix纪元)以来经过的毫秒数。而我们在控制台中看到的,是隐式转换为字符串的结果。要控制格式,需要使用该对象的方法。



提取日期组件的方法



想象一下,日期就像一张需要切成小块的披萨:年、月、日、时、分、秒。Date对象有专门的“刀具”——用于每个小块的方法。



以下是最常用的方法:



  • getFullYear() — 返回年份(例如,2024)。
  • getMonth() — 返回月份,范围从0到11。注意:一月是0,十二月是11。这是一个常见的陷阱!
  • getDate() — 返回月份中的日期(1-31)。
  • getDay() — 返回星期几,范围从0(星期日)到6(星期六)。
  • getHours()、getMinutes()、getSeconds() — 显而易见,分别是小时、分钟、秒。


让我们用它们来组装我们自己的日期:



const now = new Date();const year = now.getFullYear();const month = now.getMonth() + 1; // +1,因为一月 = 0const day = now.getDate();const hours = now.getHours();const minutes = now.getMinutes();

console.log(`${day}.${month}.${year} ${hours}:${minutes}`);// 输出:"15.10.2024 14:30"


请注意:我们给月份加了+1。这是新手常犯的经典错误——忘记从零开始编号。请永远记住:getMonth() 对于一月返回0。



美观输出:日期格式化



手动拼接字符串有助于理解,但也有更优雅的方法。JavaScript提供了几个内置的格式化方法:



1. toLocaleDateString() — 用于本地化输出



此方法会根据区域设置进行调整。想要俄语?没问题:



const now = new Date();console.log(now.toLocaleDateString('ru-RU')); // "15.10.2024"console.log(now.toLocaleDateString('en-US')); // "10/15/2024"console.log(now.toLocaleDateString('de-DE')); // "15.10.2024"


您甚至可以通过传递一个包含选项的对象来根据自己的需求定制格式:



const options = {  year: 'numeric',  month: 'long',  day: 'numeric',  weekday: 'long'};console.log(now.toLocaleDate                

博客

书籍推荐