在 Javascript 中使用日期：new Date() vs Day.js vs Moment.js

查看原始帖子 https://devaradise.com/date-in-javascript-dayjs-momentjs/ 以阅读目录

处理日期和时间是 JavaScript 开发中的一项常见任务。虽然 JavaScript 的原生 Date 对象提供了多种处理日期的方法，但在某些情况下，使用 Day.js 或 Moment.js 等外部库可以简化您的工作流程并提供更强大的解决方案。

在本文中，我们将探讨可以通过 JavaScript 的本机 Date 对象解决的常见情况以及最适合由外部库处理的情况。我们还将比较 Day.js 和 Moment.js，以帮助您选择适合您需求的工具。

原生 JS 可解决的常见情况 Date

原生 JavaScript Date 对象提供了一系列处理日期和时间的方法。以下是一些常见的用例，其中原生 Date 对象就足够了：

1. 创建日期

const now = new Date(); // Current date and time
const specificDate = new Date('2024-07-16'); // Specific date

2. 获取日期和时间组件

const now = new Date();
const year = now.getFullYear();
const month = now.getMonth() + 1; // Months are zero-indexed
const day = now.getDate();

const hours = now.getHours();
const minutes = now.getMinutes();
const seconds = now.getSeconds();

3. 设置日期和时间组件

const now = new Date();

now.setFullYear(2025);
now.setMonth(11); // December
now.setDate(25);

now.setHours(10);
now.setMinutes(11);
now.setSeconds(12);

4. 日期算术

const tomorrow = new Date();
tomorrow.setDate(tomorrow.getDate() + 1);

5. 格式化日期

const now = new Date();
const dateString = now.toDateString(); // Example: 'Tue Jul 16 2024'
const timeString = now.toTimeString(); // Example: '14:12:34 GMT+0200 (Central European Summer Time)'

6. 解析日期

const parsedDate = new Date(Date.parse('2024-07-16T14:12:34Z'));

7. 比较日期

const date1 = new Date('2024-07-16');
const date2 = new Date('2024-07-17');
const isSame = date1.getTime() === date2.getTime(); // false
const isBefore = date1.getTime() < date2.getTime(); // true

8. 获取星期几

const dayOfWeek = now.getDay(); // 0 for Sunday, 1 for Monday, etc.

9. 转换为UTC和ISO字符串

const now = new Date();
const isoDate = now.toISOString(); // 2024-07-22T11:30:59.827Z
const utcDate = now.toUTCString(); // Mon, 22 Jul 2024 11:30:42 GMT

计算日期差异

const date1 = new Date('2024-01-01');
const date2 = new Date('2024-12-31');
const differenceInTime = date2 - date1;
const differenceInDays = differenceInTime / (1000 * 3600 * 24);
console.log(differenceInDays);

最好通过 Day.js 和 Moment.js 等外部库解决的情况

虽然原生 Date 对象涵盖了基本的日期操作，但某些任务可以通过 Day.js 和 Moment.js 等外部库更有效地处理。以下是这些库表现出色的一些场景：

1. 高级格式化

// Day.js
const Day.jsDate = Day.js().format('YYYY-MM-DD HH:mm:ss');

// Moment.js
const momentDate = moment().format('YYYY-MM-DD HH:mm:ss');

2. 相对时间

// Day.js
Day.js.extend(relativeTime); // require RelativeTime plugin
Day.js('2024-01-01').from(Day.js('2023-01-01')); // a year ago

// Moment.js
moment('2024-01-01').from(moment('2023-01-01')); // a year ago

3. 时区处理

Day.js.extend(utc);
Day.js.extend(timezone);
Day.js('2024-07-16 14:12:34').tz('America/New_York');

// Moment.js with moment-timezone
moment.tz('2024-07-16 14:12:34', 'America/New_York');

4.国际化（i18n）

// Day.js
Day.js.locale('fr');
const frenchDate = Day.js().format('LLLL'); // dimanche 15 juillet 2012 11:01

// Moment.js
moment.locale('fr');
const frenchMomentDate = moment().format('LLLL'); // dimanche 15 juillet 2012 11:01

5. 处理无效日期

// Day.js
const invalidDay.js = Day.js('invalid date');
if (!invalidDay.js.isValid()) {
    console.log('Invalid date');
}

// Moment.js
const invalidMoment = moment('invalid date');
if (!invalidMoment.isValid()) {
    console.log('Invalid date');
}

6. 解析复杂的日期格式

// Day.js with customParseFormat plugin
Day.js.extend(customParseFormat);
const complexDate = Day.js('05/02/69 1:02:03 PM -05:00', 'MM/DD/YY H:mm:ss A Z');

// Moment.js
const complexMoment = moment('05/02/69 1:02:03 PM -05:00', 'MM/DD/YY H:mm:ss A Z');

7. 使用持续时间

// Day.js
Day.js.extend(duration);
const durationDay.js = Day.js.duration(5000); // 5 seconds
console.log(durationDay.js.asMinutes()); // 0.083333...
const humanizedDurationDay.js = Day.js.duration(5000).humanize(); // 'a few seconds'

// Moment.js
const durationMoment = moment.duration(5000); // 5 seconds
console.log(durationMoment.asMinutes()); // 0.083333...
const humanizedDurationMoment = moment.duration(5000).humanize(); // 'a few seconds'

Day.js 与 Moment.js：详细比较

Day.js 和 Moment.js 是 JavaScript 中两个流行的日期操作库。虽然两者具有相同的用途，但它们在性能、功能和可用性方面存在明显差异。这种比较将帮助您决定哪个库更适合您的项目。

Day.js

优点

• 轻量级：Day.js 只有 2KB，明显小于 Moment.js，这使得它非常适合性能敏感的应用程序。
• 不可变：Day.js 促进不变性，这意味着每个操作都会返回一个新实例，减少与日期操作相关的错误。
• 插件架构：Day.js 有一个模块化插件系统，允许您仅包含您需要的功能。这可以使您的捆绑包尺寸最小化。
• 现代语法：Day.js 遵循现代 JavaScript 语法，使其更容易与现代代码库集成。
• 兼容性：Day.js 被设计为 Moment.js 的直接替代品，具有类似的 API。

缺点

• 内置功能更少：与 Moment.js 相比，Day.js 的内置功能更少。高级功能需要额外的插件。
• 有限时区支持：Day.js 依赖第三方插件来提供全面的时区支持，而 Moment.js 具有 Moment 时区。
• 不太成熟的生态系统：作为一个较新的库，与成熟的 Moment.js 相比，Day.js 的集成和社区支持较少。

Moment.js

优点

• 功能丰富：Moment.js 为几乎所有日期和时间操作任务提供了一套全面的功能。
• 成熟的生态系统：Moment.js 自 2011 年以来一直存在，带来了广泛的社区支持、插件和集成。
• 时区处理：Moment.js 及其 Moment Timezone 插件提供了强大的时区支持，使其成为需要处理多个时区的应用程序的理想选择。
• 详细文档：Moment.js 拥有详细且维护良好的文档，使开发人员更容易找到帮助和示例。

缺点

• 大尺寸：Moment.js 明显大于 Day.js，这会影响性能，尤其是在客户端应用程序中。
• 可变操作：Moment.js 操作会改变原始日期对象，如果不仔细管理，可能会导致意外行为。
• 已弃用：Moment.js 团队已弃用该库，为新项目推荐 Day.js 等替代方案。

比较表

功能 Day.js Moment.js 标题>

Feature	Day.js	Moment.js
Size	~2KB	~70KB
Immutability	Yes	No
Plugin Architecture	Yes	Limited
Feature Set	Basic (extensible via plugins)	Comprehensive
Timezone Support	Limited (via plugins)	Extensive (Moment Timezone)
Ecosystem	Growing	Mature
Documentation	Good	Extensive
Modern Syntax	Yes	No
API Compatibility	Similar to Moment.js	N/A
Status	Actively maintained	Deprecated

尺寸 ~2KB ~70KB

不变性

是 否

插件架构

是 有限

功能集

基本（可通过插件扩展） 综合

时区支持

有限（通过插件） 广泛（时刻时区）

生态系统

成长 成熟 文档 好 广泛 现代语法

是 否

API 兼容性

类似于Moment.js 不适用 状态 积极维护 已弃用 表> 结论

在 JavaScript 中处理日期时，为任务选择正确的工具至关重要。原生 JavaScript Date 对象足以完成基本的日期操作任务，但对于更高级的操作，Day.js 和 Moment.js 等库提供了强大而方便的功能。

在 Day.js 和 Moment.js 之间做出选择时，请考虑您项目的具体需求。

如果您需要一个具有模块化功能的轻量级、现代且不可变的库，请选择 Day.js。它非常适合性能敏感的应用程序和项目，不需要大量开箱即用的时区处理。 如果您需要一个功能丰富的库，具有全面的时区支持和成熟的生态系统，请选择 Moment.js。但是，请记住 Moment.js 已被弃用，对于新项目，建议考虑 Day.js 等替代方案。 最终，这两个库都有自己的优势并且适合不同类型的项目。仔细评估您的项目要求以做出明智的决定。尝试将这些工具集成到您的下一个项目中，体验在 JavaScript 中处理日期的便捷性。 编码愉快！

以上是在 Javascript 中使用日期：new Date() vs Day.js vs Moment.js的详细内容。更多信息请关注PHP中文网其他相关文章！