当前位置： 云海天教程网 > 技术新闻 > 编程最新 > 正文

关于moment.js的常用方法及使用说明

  • 作者： halo1416     来源： 网络转载
  • 时间：2022-12-08

vue项目中，需要把 moment.js 挂载到全局上（即vue的原型链上），访问时直接使用 this.moment() ;

vue项目中不挂载到全局，单文件（单组件）使用：

==>>  import moment from "moment";      然后直接使用 moment() 

1. 初始化日期 / 时间

初始化日期：

moment().format("YYYY-MM-DD");

初始化日期时间：

moment().format("YYYY-MM-DD HH:mm:ss");

2. 格式化日期 / 时间

格式化日期：

moment(value).format("YYYY-MM-DD");

格式化日期时间：

moment(value).format("YYYY-MM-DD HH:mm:ss");

3. 加/减  ==>> 

操作之前必须使用 this.moment(日期变量) ；将要操作的日期转为 moment.js 可以处理的日期时间格式

加法：

this.moment().add(1, "months").format("YYYY-MM-DD");   

==>> 当前日期加一个月并输出格式为 'YYYY-MM-DD'

加法：

this.moment(startDate).add(2, "days").format("YYYY-MM-DD")     

==>> 指定日期（startDate）加2天并输出格式为 'YYYY-MM-DD'

减法：

this.moment().subtract(7, "days"); 

==>> 当前时间减去7天

加法：

this.moment(startDate).subtract(2, "days").format("YYYY-MM-DD")     

==>> 指定日期（startDate）加减去2天并输出格式为 'YYYY-MM-DD'

4. 获取某年某月的第一天或最后一天

获取某年某月的第一天：startOf('month')、startOf('year')

moment(日期).startOf("month").format("YYYY-MM-DD")//日期可以是 年月的格式 也可以是年月日的格式
 
moment(日期).startOf("year").format("YYYY-MM-DD")

获取某年某月的最后一天：endOf('month')、endOf('year')

moment(日期).endOf("month").format("YYYY-MM-DD")//日期可以是 年月的格式 也可以是年月日的格式
 
moment(日期).endOf("year").format("YYYY-MM-DD")

5. 获取星期几

获取星期几： this.moment().day()  或  this.moment(startDate).day()      ==>> 当前日期/指定日期 是星期几（星期日为 0、星期六为 6）

6. 获取毫秒数

获取毫秒数：this.moment().valueOf()  或  this.moment(startDate).valueOf()   

==>> 在获取指定时间的毫秒数时，必须要有日期。即startDate包括日期时间

7. 获取时间差（以毫秒计算）

两个日期/时间的时差：

this.moment(endTime).diff(this.moment(startTime),"days" )

==>>  开始时间和结束时间的时间差，以“天”为单位；endTime和startTime都是毫秒数

this.moment(endTime).diff(this.moment(startTime), "minutes")

==>>  开始时间和结束时间的时间差，以“分钟”为单位

==>> 注意：计算时间差时，可以以 “years”、“days”、“hours”、“minutes” 以及 "seconds" 为单位输出！

8. 两个具体的日期之差（天数，也可以是年）

9. 获取时、分、秒

原理：利用字符串的 split 方法拆分时分秒，然后分别用moment的 hour、minute 和 second 方法；带有日期的可以用 .valueof() 方法。

const fixStart = "08:00:00"
 
const getHour = this.moment().hour(Number(fixStart.split(":")[0]));
const getMinute = this.moment().minute(Number(fixStart.split(":")[1]));
const getSecond = this.moment().second(Number(fixStart.split(":")[2]));
            
// 描述为0，直接写出second(0)
const getHour_Minute_Second = this.moment().hour(Number(fixStart.split(":")[0])).minute(Number(fixStart.split(":")[1])).second(0);       
 
console.log("=====输出",getHour,getMinute,getSecond,getHour_Minute_Second);

得到的结果都是moment.js 自身的时间格式。可以用 format 转换为自己想要的格式，也可以用 diff 方法做时间差的计算

10. 将毫秒数转为时分秒

注意：毫秒转为其他单位时，达到你想要转的单位时，为1，超过时不管，不足时为0；

如4800000（80分钟）

  • 转为天：0
  • 转为小时：1
  • 转为分钟：20
  • 转为秒：0
const msTime = 4800000;        //80分钟
 
moment.duration(msTime).hours();       //转为小时，值为1
moment.duration(msTime).minutes();     //转为分钟，值为20
moment.duration(msTime).seconds();     //转为秒，值为0

转为其他单位：

moment.duration(msTime, "seconds");        //转为秒
moment.duration(msTime, "minutes");        //转为分
moment.duration(msTime, "hours");          //转为小时
moment.duration(msTime, "days");           //转为天
moment.duration(msTime, "weeks");          //转为周
moment.duration(msTime, "months");         //转为月
moment.duration(msTime, "years");          //转为年

对应的显示格式：

11. 判断一个日期是否在两个日期之间  isBetween

语法：

this.moment().isBetween(moment-like, moment-like, String, String);

a. 不包含起始这两个日期（只有两个参数）   ==>> 中文网只有两个参数

this.moment("2010-10-20").isBetween("2010-10-19", "2010-10-25"); // true
this.moment("2010-10-19").isBetween("2010-10-19", "2010-10-25"); // false
this.moment("2010-10-25").isBetween("2010-10-19", "2010-10-25"); // false

b. 自定义是否包含起始日期（四个参数，主要是第四个参数）   ==>> 英文网才有四个参数

第三个参数，固定为null；

第四个参数，字符串，( ) 表示不包含，[ ] 表示包含。右括号制开始日期，右括号控制结束日期

this.moment("2016-10-30").isBetween("2016-10-30", "2016-12-30", null, "()"); //false
this.moment("2016-10-30").isBetween("2016-10-30", "2016-12-30", null, "[)"); //true
this.moment("2016-10-30").isBetween("2016-01-01", "2016-10-30", null, "()"); //false
this.moment("2016-10-30").isBetween("2016-01-01", "2016-10-30", null, "(]"); //true
this.moment("2016-10-30").isBetween("2016-10-30", "2016-10-30", null, "[]"); //true

12. 判断一个日期是否在另外一个日期 前 isBefore

语法： this.moment( end ).isBefore( start )  moment文档

a. 默认比较日期

注意：两个日期相同是，结果也是 false

moment("2022-04-20").isBefore("2022-04-25");  // true  => 第一个日期在第二个日期前
moment("2022-04-28").isBefore("2022-04-25");  // false => 第一个日期不在第二个日期前
moment("2022-04-25").isBefore("2022-04-25");  // false => 两个日期相同

b. 第二个参数用于确定精度，因此可以指定检查年份、月份、日期

moment("2010-10-20").isBefore("2010-12-31", "year"); // false
moment("2010-10-20").isBefore("2011-01-01", "year"); // true

总结

文章仅为本人学习过程的一个记录，希望能给大家一个参考，也希望大家多多支持云海天教程。

原文地址：https://blog.csdn.net/halo1416/article/details/83620022