moment的一些常见用法总结大全

 更新时间:2023年09月30日 09:44:47   作者:是张鱼小丸子鸭  
这篇文章主要给大家总结介绍了关于moment的一些常见用法,moment.js是一个轻量级的JavaScript时间库,对于日常开发中可能会存在获取时间、设置时间、格式化时间、比较时间等,需要的朋友可以参考下

前言

在我们前端开发中,我们会涉及到许多对时间日期的一些处理,本文就是对moment常见用法的总结

指定语言

不然可能会引起不必要的bug

moment.locale('zh-cn')

下载:

 npm install moment --save
或
 yarn add moment

引入使用

 import moment from 'moment'

使用

获取时间戳

# 精确到毫秒
moment().valueOf()
## 1584182611042 ;返回值为数值类型
moment().format('x') 
## 返回值为字符串类型
# 精确到秒 
moment().unix()
##  1584182618 精确到秒  返回值为数值类型
moment().format('X') 
##  返回值为字符串类型

生成指定时间的moment

moment("2000-9-28")
#带格式
moment("2000-9-28","MM-DD-YYYY")

获取对象

moment().toObject();
# 返回一个包括:年、月、日、时、分、秒、毫秒的对象
# {
    years: 2020
    months: 2
    date: 14
    hours: 18
    minutes: 47
    seconds: 56
    milliseconds: 526
}

 格式化

moment().format();
# 2020-03-14T19:14:05+08:00
#默认返回的是上面的格式,我们也可以进行指定格式 
moment().format('YYYY-MM-DD HH:mm:ss');
# 2020-03-14 19:23:29

 获取时间

#获取今天的时分秒
moment().startOf('day')
#获取本周的第一天(周日)时分秒
moment().startOf('week')
#获取本周周几的时分秒
moment().startOf('星期几')
#获取当月第一天的时分秒
moment().startOf('month')
# 获取指定日期的0时0分0秒
moment('2019-10-20').startOf('day')
# 获取今天23时59分59秒
moment().endOf('day')
# 获取本周最后一天(周六)23时59分59秒
moment().endOf('week')
# 获取本周周日23时59分59秒
moment().endOf('isoWeek')
# 获取当前月最后一天23时59分59秒
moment().endOf('month')

获取当月的第一天时星期几

# 用于设置星期几,其中星期日为 0、星期六为 6
moment().startOf('month').day()

获取前n天/后n天

moment().add(7, 'days');
moment().subtract(7, 'days')

获取两个日期的时间差

moment([2008, 2, 27]).diff([2007, 0, 28], 'day');
# 424

比较两个时间的大小

moment('2010-10-31').isBefore('2010-12-31', 'day');
# true

第二个参数用于确定精度,且不仅仅是要检查的单个值,因此使用 day 将会检查年份、月份、日期

需要注意的是:isBefore与isAfter都是开区间,如果想要使用闭区间,应该使用isSameOrBefore

isSameOrAfter

判断一个年份是否是闰年

#不写年份的话,默认判断的是今年
moment().isLeapYear();
# false
moment([2001]).isLeapYear() 
# false

获取月份和星期

moment.months()
# ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
moment.monthsShort()
# ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
moment.weekdays()
# ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]
moment.weekdaysMin()
# ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]

基础操作

moment().hour() // 小时
moment().date() // 一个月里的第几天
moment().day() // 星期几
moment().dayOfYear() // 一年里的第几天
moment().week() // 一年里的第几周
moment().month() // 第几个月
moment().quarter() // 一年里的第几个季度
moment().year() // 年
moment().daysInMonth() // 当前月有多少天
//操作
moment().add(7, 'days') // 之后的第7天。第2个参数还可以是 'months', 'years' 等。注意是复数。
moment().add(7, 'd')// 与上面一行代码的运行结果一样。
moment().subtract(1, 'months') // 上个月
// 还支持 'year','month' 等
moment().endOf('week')
// 早于
moment('2010-10-20').isBefore('2010-10-21') // true
moment('2010-10-20').isBefore('2010-12-31', 'year') // false
// 是否相等
moment('2010-10-20').isSame('2010-10-20') // true
moment('2010-10-20').isSame('2009-12-31', 'year')  // false
// 晚于
moment('2010-10-20').isAfter('2010-10-19') // true
moment('2010-10-20').isAfter('2010-01-01', 'year') // false
// 是否在时间范围内
moment('2010-10-20').isBetween('2010-10-19', '2010-10-25') // true
moment('2010-10-20').isBetween('2010-01-01', '2012-01-01', 'year') // false
moment().isLeapYear() 

总结 

到此这篇关于moment的一些常见用法的文章就介绍到这了,更多相关moment常见用法内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • JavaScript解析JSON格式数据的方法示例

    JavaScript解析JSON格式数据的方法示例

    这篇文章主要介绍了JavaScript解析JSON格式数据的方法,结合实例形式分析了JavaScript解析json格式数据的常用函数与使用技巧,需要的朋友可以参考下
    2017-01-01
  • JavaScript 中 this 关键字的作用及改变其上下文的方法

    JavaScript 中 this 关键字的作用及改变其上下文的方法

    这篇文章主要介绍了JavaScript 中 this 关键字的作用和如何改变其上下文,通过使用 call, apply, bind 方法,可以改变函数中的 this 指向,从而在不同的上下文中使用同一个函数,需要的朋友可以参考下
    2023-01-01
  • ts依赖引入报错:无法找到模块“xxxxxx”的声明文件问题解决

    ts依赖引入报错:无法找到模块“xxxxxx”的声明文件问题解决

    这篇文章主要给大家介绍了关于ts依赖引入报错:无法找到模块“xxxxxx”的声明文件问题的解决办法,文中通过示例带将解决办法介绍的非常详细,需要的朋友可以参考下
    2023-07-07
  • JavaScript微信定位功能实现方法

    JavaScript微信定位功能实现方法

    这篇文章主要介绍了JavaScript微信定位功能实现方法,将定位到的经纬度转换为百度地图对应的经纬度,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-11-11
  • 使用JS前端技术实现静态图片局部流动效果

    使用JS前端技术实现静态图片局部流动效果

    本文使用前端开发技术,结合 SVG 和 CSS 来实现类似的液化流动效果,包含的知识点主要包括:mask-image 遮罩、feTurbulence 和 feDisplacementMap 滤镜、filter 属性、canvas 绘制方法、TimelineMax 动画及input[type=file] 本地图片资源加载,需要的朋友可以参考下
    2022-08-08
  • 使用 Opentype.js 生成字体子集的实例代码详解

    使用 Opentype.js 生成字体子集的实例代码详解

    这篇文章主要介绍了使用 Opentype.js 生成字体子集,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-05-05
  • js数字转中文两种实现方法

    js数字转中文两种实现方法

    在前端开发中有时候会需要到将阿拉伯数字转化为中文,当前做个记录,提供自己之后翻阅,这篇文章主要给大家介绍了关于js数字转中文两种实现方法的相关资料,需要的朋友可以参考下
    2023-10-10
  • 轻松学习Javascript闭包

    轻松学习Javascript闭包

    闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现。这篇文章主要介绍了Javascript闭包,需要的朋友可以参考下
    2017-03-03
  • 写给小白看的JavaScript异步

    写给小白看的JavaScript异步

    写给小白看的JavaScript异步,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-11-11
  • JavaScript编写的网页小游戏,很给力

    JavaScript编写的网页小游戏,很给力

    这篇文章主要介绍了JavaScript编写的网页小游戏,附上全部代码供大家查看,实现了网页的小游戏页面,需要的朋友可以参考下
    2017-08-08

最新评论