moment.js 的使用
moment.js 的引入1.Node.js方式引入安装npm install moment全局引入import { createApp } from 'vue'import App from './App.vue'import router from './router'import store from './store'// 导入moment.jaimport moment from 'mo
前言
JavaScript 中的日期处理 Date() 对象一直是饱受诟病,非常不友好,该对象是1995 年受到 Java 的启发而实现的,自此之后Date()
就再也没有发生过迭代。而在日常开发中经常遇到日期时间的处理,所以就有moment.js这类时间日期处理工具包。
Moment.js是一个轻量级的JavaScript时间库,它方便了日常开发中对时间的操作,提高了开发效率。日常开发中,通常会对时间进行下面这几个操作:比如获取时间,设置时间,格式化时间,比较时间等等。而moment.js提供了强大的时间处理能力
moment.js 的引入
1.Node.js方式引入
安装
npm install moment
全局引入
import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
// 导入moment.ja
import moment from 'moment'
// 定位中国使用中文
moment.locale('zh-cn')
const app = createApp(App);
// 添加到全局配置属性
app.config.globalProperties.$moment = moment;
app.use(store).use(router).mount('#app')
2.浏览器方式引入
<script src="moment.js"></script>
moment.js 的使用
1.获取时间
(1)获取当前日期时间
moment().format(); //2022-04-19T19:12:35+08:00
(2)获取年、月、日、时、分、秒、毫秒
moment().year(); // 2022
moment().momth(); // 3
moment().date(); // 19
moment().hour(); // 19
moment().minute(); // 12
moment().second(); // 35
moment().millisecond(); // 410
(3)获取周、星期
moment().week(); // 16 今年第16周
moment().day(); // 2 星期2
moment().weeksInYear();// 52 今年周数
2.格式化日期时间
说明 | 格式 | 输出 |
年份 | YY | 70 71 ... 29 30 |
YYYY | 1970 1971 ... 2029 2030 | |
月份 | M | 1 2 ... 11 12 |
Mo | 1st 2nd ... 11th 12th | |
MM | 01 02 ... 11 12 | |
MMM | Jan Feb ... Nov Dec | |
MMMM | January February ... November December | |
月份的日期 | D | 1 2 ... 30 31 |
Do | 1st 2nd ... 30th 31st | |
DD | 01 02 ... 30 31 | |
小时 | H | 0 1 ... 22 23 |
HH | 00 01 ... 22 23 | |
h | 1 2 ... 11 12 | |
hh | 01 02 ... 11 12 | |
k | 1 2 ... 23 24 | |
分钟 | m | 0 1 ... 58 59 |
mm | 00 01 ... 58 59 | |
秒钟 | s | 0 1 ... 58 59 |
ss | 00 01 ... 58 59 | |
星期几 | d | 0 1 ... 5 6 |
do | 0th 1st ... 5th 6th | |
dd | Su Mo ... Fr Sa | |
ddd | Sun Mon ... Fri Sat | |
dddd | Sunday Monday ... Friday Saturday | |
季度 | Q | 1 2 3 4 |
Qo | 1st 2nd 3rd 4th | |
年份中的星期 | w | 1 2 ... 52 53 |
wo | 1st 2nd ... 52nd 53rd | |
ww | 01 02 ... 52 53 | |
子午线 | A | AM PM |
a | am pm | |
Unix 时间戳 | X | 1650449323 |
Unix 毫秒时间戳 | x | 1650449323598 |
(1)格式化年月日: YYYY年MM月DD日
moment().format('YYYY年MM月DD日') //2022年04月20日
(2)格式化年月日:YYYY-MM-DD
moment().format('YYYY-MM-DD'); //2022-04-20
(3)格式化时分秒:HH时mm分ss秒
moment().format('HH时mm分ss秒'); //18时08分43秒
(4)格式化时分秒:HH:mm:ss
moment().format('HH:mm:ss'); //19:07:09
moment().format('HH:mm:ss a'); //19:07:09 晚上
(5)格式化参数
moment('2022-04-20T19:01:09+08:00').format('YYYY-MM-DD'); //2022-04-20
moment('2022-04-20T19:01:09+08:00').format('YYYY年MM月DD日'); //2022年04月20日
moment('2022-04-20T19:01:09+08:00').format('HH:mm:ss'); //19:01:09
3.查询
(1)获取过去的时间
moment().subtract(1, 'year').format('YYYY-MM-DD'); //2021-04-21
moment().subtract(1, 'months').format('YYYY-MM-DD'); //2022-03-21
moment().subtract(1, 'days').format('YYYY-MM-DD'); //2022-04-20
moment().subtract(1, 'hours').format('HH:mm:ss'); //17:54:00
moment().subtract(1, 'minute').format('HH:mm:ss'); //18:53:00
moment().subtract(1, 'seconds').format('HH:mm:ss'); //18:52:59
moment('2021-01-01').subtract(1, 'year').format('YYYY-MM-DD'); //2020-01-01
moment('2021-01-01').subtract(1, 'months').format('YYYY-MM-DD'); //2020-12-01
moment('2021-01-01').subtract(1, 'days').format('YYYY-MM-DD'); //2020-12-31
moment('2021-01-01').subtract(1, 'hours').format('YYYY-MM-DD HH:mm:ss'); //2020-12-31 23:00:00
moment('2021-01-01').subtract(1, 'minute').format('YYYY-MM-DD HH:mm:ss'); //2020-12-31 23:59:00
moment('2021-01-01').subtract(1, 'seconds').format('HH:mm:ss'); //23:59:59
(2)获取将来的时间moment().add(),用法同moment().subtract()。
moment('2021-01-01').add(1, 'year').format('YYYY-MM-DD'); //2022-01-01
moment('2021-01-01').add(1, 'months').format('YYYY-MM-DD'); //2021-02-01
moment('2021-01-01').add(1, 'days').format('YYYY-MM-DD'); //2021-01-02
moment('2021-01-01').add(1, 'hours').format('YYYY-MM-DD HH:mm:ss'); //2021-01-01 01:00:00
moment('2021-01-01').add(1, 'minute').format('YYYY-MM-DD HH:mm:ss'); //2021-01-01 00:01:00
moment('2021-01-01').add(1, 'seconds').format('HH:mm:ss'); //00:00:01
(3)判断日期时间
moment('2022-04-20').isBefore('2022-04-21'); //true
moment('2022-04-20').isSame('2022-04-20'); //true
moment('2022-04-20').isAfter('2022-04-20'); //false
moment('2022-04-20').isBetween('2022-04-19', '2022-04-21'); //true
moment('2016-10-30').isBetween('2016-10-30', '2016-12-30', null, '()'); //false
moment('2016-10-30').isBetween('2016-10-30', '2016-12-30', null, '[)'); //true
moment('2016-10-30').isBetween('2016-01-01', '2016-10-30', null, '()'); //false
moment('2016-10-30').isBetween('2016-01-01', '2016-10-30', null, '(]'); //true
moment('2016-10-30').isBetween('2016-10-30', '2016-10-30', null, '[]'); //true
4.Temporal
Temporal——JavaScript的一个全新的用于处理日期和时间的标准对象和函数,目前正处于第三阶段的测试,当进入第四阶段的提案将会被纳入到ES每年发布的规范之中。
它为 JavaScript 日期/时间操作带来了以下修复:
-
仅可以创建和处理不可变Temporal对象;
-
提供用于日期和时间计算的简单 API;
-
支持所有时区;
-
从 ISO-8601 格式进行严格的日期解析;
-
支持非公历。
Temporal文档:Temporal documentation
更多推荐
所有评论(0)