JavaScript Date对象四大误用点：构造时字符串解析歧义（推荐数字参数或带时区ISO）、toLocaleString()依赖系统设置（需显式指定语言和时区）、手写格式化忽略UTC与补零陷阱、复杂需求才引入dayjs/date-fns。
JavaScript 原生 Date 对象的常见误用点
直接调用 new Date() 拿到的是本地时区时间，但传入字符串（如 "2023-10-05"）时，不同浏览器解析规则不一致：Chrome 和 Firefox 将其视为 UTC 时间，Safari 则当作本地时间。这会导致同一条代码在不同设备上生成相差数小时的 Date 实例。
避免字符串解析歧义，优先用数字参数构造：
new Date(2023, 9, 5, 14, 30, 0) // 注意：月份是 0~11
或明确指定时区的 ISO 字符串：
new Date("2023-10-05T14:30:00Z") // Z 表示 UTC
- 传入
"2023-10-05"→ 不推荐，行为不可控 - 传入
"2023-10-05T00:00"→ 仍可能被当作本地时间 - 传入
"2023-10-05T00:00:00+08:00"→ 显式时区，安全
toLocaleString() 的实际控制方式
它不是“随便格式化”，而是依赖操作系统语言和时区设置，且支持细粒度选项。默认输出可能不符合中文场景（比如英文星期、AM/PM），但加参数就能精准控制：
立即学习“Java免费学习笔记（深入）”；
const d = new Date("2023-10-05T14:30:45.123Z");
d.toLocaleString("zh-CN", {
year: "numeric",
month: "2-digit",
day: "2-digit",
hour: "2-digit",
minute: "2-digit",
second: "2-digit",
hour12: false
}); // "2023/10/05 14:30:45"
-
hour12: false必须显式设为false，否则中文环境下仍可能出"下午 2:30" -
timeZone: "Asia/Shanghai"可强制按东八区显示，绕过用户本地设置 - 不传语言标签（如
"zh-CN"）时，结果完全取决于浏览器环境，线上不可靠
手写简单格式化函数时的关键陷阱
很多人用 getMonth() + 1 拼年月日，但忽略补零和时区偏移。例如 d.getDate() 返回的是本地日期，若服务器时间是 UTC，而用户在东京（UTC+9），2023-10-05T23:00:00Z 在本地会变成 10月6日，导致显示错误。
更稳妥的做法是统一用 UTC 方法（getUTCFullYear() 等）再补零：
function formatUTC(d) {
return [
d.getUTCFullYear(),
String(d.getUTCMonth() + 1).padStart(2, "0"),
String(d.getUTCDate()).padStart(2, "0")
].join("-") + " " +
[
String(d.getUTCHours()).padStart(2, "0"),
String(d.getUTCMinutes()).padStart(2, "0"),
String(d.getUTCSeconds()).padStart(2, "0")
].join(":");
}
-
padStart(2, "0")比toString().padStart(2, "0")更安全，避免null或undefined报错 - 别用
toISOString().slice(0, 19)截取 —— 它固定返回 UTC 时间，但末尾带"Z"，且不含毫秒，也不适配本地展示需求 - 如果需兼容 IE，
padStart要 polyfill 或改用("0" + n).slice(-2)
要不要引入 date-fns 或 dayjs？
纯前端项目中，若只做简单展示（如“今天”“昨天”“YYYY-MM-DD”），原生 API + 小工具函数足够；但一旦涉及相对时间（2 hours ago）、跨时区计算、周起始日自定义、或大量格式化模板，原生就力不从心了。
dayjs 是轻量替代方案（约 2KB），API 类似 moment 但不可变：
import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';
dayjs.extend(relativeTime);
dayjs("2023-10-04").fromNow(); // "a day ago"
-
date-fns是函数式设计，tree-shaking 友好，但每个功能要单独 import：format,parseISO,isToday - 避免同时引入多个库（比如又用
moment又用dayjs），它们对Date对象的扩展可能冲突 - 服务端渲染（SSR）场景下，注意
dayjs默认使用浏览器时区，需手动dayjs.tz.setDefault("Asia/Shanghai")
