尧图网站建设 尧图网络
  • 首页
  • 关于我们
  • 服务项目
  • 案例展示
  • 建站流程
  • 资讯中心
  • 联系我们
首页/资讯中心/详情

JavaScript 中处理日期格式化

JavaScript 中处理日期格式化
📅 发布时间:2026/6/19 17:22:06

在 JavaScript 中处理日期格式化,原生能力确实有限,但现代的 Intl 对象提供了不错的基础支持。对于更复杂或要求高的场景,社区一些优秀的库能让你事半功倍。

下面这个表格整理了主要的日期格式化方案,帮你快速了解:

方案类型 代表库/方法 核心特点 适用场景
原生 JS 方案 Intl.DateTimeFormat 浏览器内置,支持国际化,无需额外依赖 简单的、对包体积敏感的需求
手动拼接 完全控制输出格式,代码灵活 极简单的特定格式,且不愿引入任何工具
第三方库 Day.js 轻量(仅 2kB),API 与 Moment.js 相似 绝大多数项目,平衡功能与体积
date-fns 函数式、模块化,按需引入 模块化项目,追求 tree shaking
Moment.js 功能极其全面,社区资源丰富 遗留项目,或需要处理非常复杂的日期时间

💻 原生 JavaScript 方案

如果需求简单,或者你特别在意包大小,原生能力基本够用。

  1. Intl.DateTimeFormat (推荐)
    这是目前浏览器原生方法里最强大和现代的,尤其擅长处理国际化。

    const date = new Date();
    const formatter = new Intl.DateTimeFormat('zh-CN', {year: 'numeric',month: '2-digit',day: '2-digit',hour: '2-digit',minute: '2-digit',second: '2-digit',hour12: false // 使用24小时制
    });
    console.log(formatter.format(date)); // 输出示例: "2023/10/05 15:24:00"
    
  2. 手动拼接
    这种方式就是直接获取日期的各个部分,然后拼成你想要的字符串。

    function formatDate(date) {const year = date.getFullYear();const month = String(date.getMonth() + 1).padStart(2, '0');const day = String(date.getDate()).padStart(2, '0');const hours = String(date.getHours()).padStart(2, '0');const minutes = String(date.getMinutes()).padStart(2, '0');const seconds = String(date.getSeconds()).padStart(2, '0');return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
    }console.log(formatDate(new Date())); // 输出示例: "2023-10-05 15:24:00"
    

    缺点也很明显:代码相对繁琐,处理12小时制、时区、本地化等会很麻烦。

🧰 第三方库推荐

当原生方法无法满足需求时,下面这些库是更好的选择。

  1. Day.js:现代轻量之选

    • 优势:API 设计友好,体积极小,可以通过插件扩展功能(如时区、相对时间等)。
    • 示例:
      import dayjs from 'dayjs';console.log(dayjs().format('YYYY-MM-DD')); // 输出示例:"2025-03-26"
      console.log(dayjs().format('YYYY-MM-DD HH:mm:ss')); // 输出示例:"2025-06-05 10:00:00"
      
  2. date-fns:模块化工具集

    • 优势:函数式编程风格,利于 tree shaking,特别适合在模块化打包的项目中使用,可以只引入你用到的方法。
    • 示例:
      import { format } from 'date-fns';console.log(format(new Date(), 'yyyy-MM-dd HH:mm:ss')); // 输出示例:"2023-06-05 10:00:00"
      

💎 如何选择?

  • 追求小巧、易上手,应对大部分日常场景:直接选择 Day.js。
  • 项目基于模块化构建,且注重代码最优打包:可以考虑 date-fns。
  • 处理简单日期显示,且不希望任何外部依赖:使用原生的 Intl.DateTimeFormat。
  • 维护老项目,或需要进行极其复杂的日期操作(如大量历史时区转换):才考虑 Moment.js。

相关新闻

  • 2025年在线粘度计厂家推荐排行榜,实验室在线粘度计,工业在线粘度计,高精度在线粘度计公司推荐!
  • 2025年网格川字塑料托盘厂家推荐排行榜,耐用抗压,仓储物流首选!
  • 基于MATLAB的FIR和IIR低通/带通滤波器实现

最新新闻

  • 携手共建国产CAD生态,浩辰软件开发者生态网络正式成立
  • 死锁分析进阶:从日志到根因,一次搞定死锁排查
  • 2026深圳同城搬家收费标准如何确定?深圳搬家公司哪家值得信赖?深圳家顺兴搬家专业搬家服务商深度解析 - 深圳家顺兴搬家
  • Parsec VDD完全指南:免费开源的Windows虚拟显示器解决方案
  • Windows 11系统性能优化指南:Win11Debloat开源工具深度解析
  • 佛山桂城川菜宵夜实测|四家热门川味门店真实口感与性价比测评 - 速递信息

日新闻

  • 5分钟掌握Python进化算法:Geatpy高性能优化工具完全指南
  • Microchip 24AA044 EEPROM选型与应用全指南:从参数解析到实战编程
  • 华为的鸿蒙到底有多牛?为什么称作遥遥领先?

周新闻

  • 3步解锁iOS设备:applera1n激活锁绕过完全指南
  • 39 2026 人工智能证书终极盘点,普通人选 AI 证书可以从这些方向入手
  • Redis 暴露公网有多危险?从端口检查到补救步骤

月新闻

  • 【总结】入门篇:50句话让你记住架构核心概念
  • WeChatMsg技术方案解析:实现Mac微信数据自主管理的完整解决方案
  • WeChatMsg:革新性微信数据备份方案,打造你的专属数字记忆库

关于尧图

  • 公司简介
  • 团队介绍
  • 企业文化
  • 荣誉资质

服务项目

  • 定制开发
  • 电商建站
  • UI 设计
  • 运维服务

快速链接

  • 案例展示
  • 建站流程
  • 常见问题
  • 资讯中心

联系方式

  • 📍北京市朝阳区互联网产业园 A 座 10 层
  • 📞400-888-8888
  • ✉️contact@rkmt.cn
  • 🕐周一至周日 9:00-21:00

© 2024 北京尧图网络科技有限公司 版权所有 | 京 ICP 备 XXXXXXXX 号