一天一个前端知识点(12)：如何处理时间（date）?

南叶
58 阅读3分钟

JavaScript 中的 Date 对象提供了处理日期和时间的功能。以下是 Date 对象的一些常见用法技巧和注意点：

  1. 创建一个新的 Date 对象：

    const date = new Date();
console.log(date); // 输出当前时间

  2. 创建指定日期和时间的 Date 对象：

    const date = new Date("2022-01-01T00:00:00");
console.log(date); // 输出指定时间

  3. 获取 Date 对象的属性：

    const date = new Date();
const year = date.getFullYear();
const month = date.getMonth();
const day = date.getDate();
const hours = date.getHours();
const minutes = date.getMinutes();
const seconds = date.getSeconds();
console.log(year, month, day, hours, minutes, seconds); // 输出当前时间的年月日时分秒

  4. 设置 Date 对象的属性：

    const date = new Date();
date.setFullYear(2022);
date.setMonth(0);
date.setDate(1);
date.setHours(0);
date.setMinutes(0);
date.setSeconds(0);
console.log(date); // 输出新的时间，即 2022 年 1 月 1 日 00:00:00

  5. 将 Date 对象转换成字符串：

    const date = new Date();
const dateString = date.toString();
console.log(dateString); // 输出类似 "Mon May 10 2023 16:47:09 GMT+0800 (China Standard Time)" 的字符串

  6. 将 Date 对象转换成时间戳：

    const date = new Date();
const timestamp = date.getTime();
console.log(timestamp); // 输出当前时间的时间戳

  7. 注意 Date 对象的月份从 0 开始计数，即 0 表示一月，1 表示二月，以此类推，11 表示十二月。

  8. 当使用字符串创建 Date 对象时，字符串的格式应该符合 ISO 8601 标准，即 "yyyy-mm-ddThh:mm:ss"，其中 "T" 是日期和时间的分隔符。

  9. Date 对象的时间范围是从 1970 年 1 月 1 日 00:00:00 UTC 到 10,000 年后的某个时间。超出这个范围的时间会导致错误或不可预测的行为。

避坑指南

一、可选择第三方库，如 momentjs, dayjs

Moment.js 的优点：

  1. Moment.js 是最早和最流行的 JavaScript 日期库之一，有大量的文档和社区支持。
  2. Moment.js 有丰富的功能，可以进行日期格式化、日期比较、日期计算等。
  3. Moment.js 支持时区转换、本地化等高级特性。
  4. Moment.js 有许多插件可用，可以进一步扩展其功能。

Moment.js 的缺点：

  1. Moment.js 的体积比较大，在某些项目中可能会增加页面加载时间。
  2. Moment.js 的开发团队已经宣布停止维护和更新，虽然它仍然可以使用，但可能会有一些安全和兼容性问题。

dayjs 的优点：

  1. dayjs 是一个较新的日期库，它的体积比 Moment.js 更小，而且性能更好。
  2. dayjs 拥有和 Moment.js 类似的 API，易于学习和使用。
  3. dayjs 支持时区转换、本地化等高级特性。
  4. dayjs 兼容性良好，可以在现代浏览器和 Node.js 中使用。

dayjs 的缺点：

  1. dayjs 的社区和插件生态系统比 Moment.js 较小，所以可能缺乏某些高级功能和扩展。
  2. dayjs 相对于 Moment.js 还是一个比较新的项目，可能存在一些未知的问题和潜在的风险。

综上所述，如果项目需要使用丰富的日期处理功能和大量的文档和社区支持，可以选择 Moment.js；如果项目需要更轻量级、更快速的解决方案，并且只需要基本的日期处理功能，可以选择 dayjs。

avatar
文章
阅读
粉丝