javascript如何操作日期和时间_有哪些常用库？_网络技术

javascript如何操作日期和时间_有哪些常用库？

发布时间 - 2026-01-05 00:00:00 点击率：次

原生 Date 有设计缺陷，推荐用 date-fns（轻量、纯函数）或 dayjs（Moment 替代，仅 2KB）；Moment.js 已不建议新项目使用。

JavaScript 原生 Date 对象够用，但写法繁琐、易出错；生产项目推荐用 date-fns（轻量、函数式）或 dayjs（API 类似 Moment，体积小），Moment.js 已不建议新项目使用。

原生 `Date` 的坑怎么绕开？

原生 Date 构造行为不一致、时区处理反直觉、月份从 0 开始、getMonth() 和 getDay() 容易混淆——这些不是“用法问题”，是设计缺陷。

new Date('2025-10-01') 在 Safari 和部分安卓 WebView 中解析为 UTC 时间，而在 Chrome 中可能按本地时区解析；统一改用 new Date(2025, 9, 1)（注意：月份是 0–11）
格式化必须手写拼接，比如 ${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}
计算“7 天后”不能直接 d.setDate(d.getDate() + 7)，因为会修改原对象且跨月时逻辑脆弱；应先克隆：const next = new Date(d); next.setDate(d.getDate() + 7);

`date-fns` 为什么适合大多数场景？

它按需引入、无副作用、类型友好（自带 TypeScript 支持），所有函数都是纯函数，不会修改原始 Date 对象。

安装：npm install date-fns
常用操作示例（ESM 方式导入）：

import { addDays, format, parseISO, isAfter, differenceInCalendarDays } from 'date-fns';
const d = parseISO('2025-10-01');
const tomorrow = addDays(d, 1);
console.log(format(tomorrow, 'yyyy-MM-dd')); // '2025-10-02'
console.log(differenceInCalendarDays(new Date(), d)); // 距离今天多少整天

注意：不要 import 整个包（import * as dateFns from 'date-fns'），否则会打包全部函数，体积暴增
时区相关操作（如转 UTC、显示用户本地时间）需配合 date-fns-tz 插件

`dayjs` 和 `Moment.js` 怎么选？

dayjs 是 Moment 的轻量替代，API 高度兼容，压缩后仅 2KB；Moment.js 已进入维护模式，官方明确建议迁移到 dayjs 或 date-fns。

dayjs 默认不带插件，如需相对时间（fromNow）、时区支持，要显式引入：import 'dayjs/plugin/relativeTime'; dayjs.extend(relativeTime);
Moment.js 的 moment().add(1, 'days') 看似简洁，但内部 mutates 原对象，且包体积超 300KB，Tree-shaking 无效
若项目已重度依赖 Moment，可先用 moment-timezone + moment，但新功能开发请避免再加 Moment 代码

真正难的不是“选哪个库”，而是统一团队对时区的处理策略：后端传的时间戳是否含时区？前端展示要不要转成本地时间？日历组件选中日期要不要归零时分秒？这些比函数调用更影响稳定性。

# javascript # java # js # 前端 # typescript # npm # 安卓 # safari # 后端 # yy # 为什么

相关栏目：【网站优化151355 】【网络推广146373 】【网络技术251813 】【 AI营销90571 】

上一篇：Win11怎么关闭快速启动 Win11彻底关机设置方法【指南

下一篇：如何实现JavaScript文件上传_进度条怎样实时显示？

相关栏目网站优化
网络推广
网络技术
AI营销

最新文章 Sublime怎么一键压缩JS代码 Su sublime如何在搜索中使用正则表达式 Sublime如何设置透明窗口效果 Su mysql如何设计商品表结构_mysql css属性背景图不显示怎么办_通过检查路如何使用Golang实现排序_Golan 农历闰月是怎么回事_为合回归年加一月调整塑造《刺客信条》艾吉奥传奇的编剧离开育碧 1英里等于多少公里 1mile和km的换 css grid布局中行和列是如何定义的 PS批量旋转和翻转图片，快速校正图片方向 C# Swagger UI自定义方法 C OPPO手机九宫格和全键盘怎么切换_OP Go语言如何实现用户登录注册_Golan 1节飞行速度多少公里每小时 1节是多少公纸嫁衣8千子树第五章庙门怎么开启庙门 Laravel 多行数据编辑表单中实现逐明日之后如何提升钓鱼等级明日之后提升钓支付宝怎样查年度账单_支付宝年度账单查看 C# 多线程UI更新Dispatcher

上一篇：Win11怎么关闭快速启动 Win11彻底关机设置方法【指南

下一篇：如何实现JavaScript文件上传_进度条怎样实时显示？

javascript如何操作日期和时间_有哪些常用库？

原生 Date 的坑怎么绕开？

date-fns 为什么适合大多数场景？

dayjs 和 Moment.js 怎么选？

原生 `Date` 的坑怎么绕开？

`date-fns` 为什么适合大多数场景？

`dayjs` 和 `Moment.js` 怎么选？