JavaScript日期实用程序:转换,格式和显示日期
2025-02-17 14:37:10
0浏览
收藏
小伙伴们对文章编程感兴趣吗?是否正在学习相关知识点?如果是,那么本文《JavaScript日期实用程序:转换,格式和显示日期》,就很适合你,本篇文章讲解的知识点主要包括。在之后的文章中也会多多分享相关知识点,希望对大家的知识积累有所帮助!

getFormattedDate 函数:简化 JavaScript 和 TypeScript 日期格式化
此 JavaScript/TypeScript 函数 getFormattedDate 简化了日期格式化,提供多种格式选项,确保可靠的日期转换。支持多种日期格式,包括 dd/MM/yyyy、MM/dd/yyyy、yyyy/MM/dd 和 yyyy/dd/MM,并提供完整的日期显示格式(例如,“2024年10月15日”),增强可读性。
import { allMonths } from "@/constants/months.constants";
export const getFormattedDate = (
date: string | Date,
format?: "dd/MM/yyyy" | "MM/dd/yyyy" | "yyyy/MM/dd" | "yyyy/dd/MM",
fullDate: boolean = false
): string => {
const dateObj = typeof date === "string" ? new Date(date) : date;
if (isNaN(dateObj.getTime())) {
throw new Error("无效日期");
}
const day = dateObj.getDate().toString().padStart(2, "0");
const month = (dateObj.getMonth() + 1).toString().padStart(2, "0");
const year = dateObj.getFullYear();
if (fullDate) {
return `${day} ${allMonths[dateObj.getMonth()]} ${year}`;
}
switch (format) {
case "dd/MM/yyyy":
return `${day}/${month}/${year}`;
case "MM/dd/yyyy":
return `${month}/${day}/${year}`;
case "yyyy/MM/dd":
return `${year}/${month}/${day}`;
case "yyyy/dd/MM":
return `${year}/${day}/${month}`;
default:
throw new Error("不支持的格式");
}
};
const exampleDate = "2024-02-10T12:30:00Z";
getFormattedDate(exampleDate, "dd/MM/yyyy");
// 使用 fullDate: true 获取完整日期格式
主要功能:
- 灵活的格式化选项: 支持多种日期格式,适应不同地区习惯。
- 增强可读性:
fullDate选项提供更易读的完整日期格式(包含月份全称)。 - 可靠的日期转换: 确保字符串输入正确转换为日期对象。
- 错误处理: 对无效日期进行错误处理,并返回清晰的错误信息。
- SEO 和 UX 优化: 格式良好的日期提升用户体验和内容可读性,对 SEO 有利。
适用场景:
该实用程序非常适合电子商务平台、预订系统、博客和仪表板等需要日期显示的应用场景,它能优化日期显示,同时保持代码简洁高效。
感谢 Ancliful Islam 的贡献,其代码编写清晰易懂。
今天带大家了解了的相关知识,希望对你有所帮助;关于文章的技术知识我们会一点点深入介绍,欢迎大家关注golang学习网公众号,一起学习编程~
微软发布KB5046617更新,解决Windows Server 2025蓝屏及升级难题
- 上一篇
- 微软发布KB5046617更新,解决Windows Server 2025蓝屏及升级难题
- 下一篇
- 解决Linux上K8S安装的疑难杂症
查看更多
最新文章
-
- 文章 · 前端 | 2天前 | js语法教程
- JSSet集合使用与去重技巧详解
- 350浏览 收藏
-
- 文章 · 前端 | 2天前 |
- HTML5离线缓存清除方法大全
- 462浏览 收藏
-
- 文章 · 前端 | 2天前 |
- HTML编码如何避免乱码问题
- 235浏览 收藏
-
- 文章 · 前端 | 2天前 |
- HTMLaddress标签使用方法详解
- 309浏览 收藏
-
- 文章 · 前端 | 2天前 |
- 发布订阅模式消息队列原理与实现解析
- 135浏览 收藏

