Moment-基本概念篇

作者 : 开心源码 本文共3533个字,预计阅读时间需要9分钟 发布时间: 2022-05-13 共171人阅读

Moment.js 是一个强大到有些不正经的日期解决库。
支持TS
国际化,少量函数的输出会根据当前语言环境。
高度自己设置

有了它只需后端不是自创的格式我们都可以解析,解析问题可见这篇文章
在转换为文字上颇有门道
本文将抛砖引玉,简单详情少量基本概念和常用的API,方便日常工作时快速理解。

默认

Moment.js 会为 Date 对象创立封装器,而不是修改本地的 Date.prototype,Moment 原型通过 moment.fn 公开。 假如要增加自己的函数,则可以在其中放置它们。

moment("15", "hh").format('YYYY-MM-DD HH:mm:ss');// "2020-02-04 15:00:00"

可以创立一个 moment 对象,仅指定少量单位,其他的将会默认为当前的日期、月份、年份,小时、分钟、秒钟和毫秒默认为 0

以对象形式指定:

moment({hour: 5, minute: 10, seconds: 20}).format('YYYY-MM-DD HH:mm:ss');"2020-02-04 05:10:20"

支持解析 hmm、Hmm、hmmss 和 Hmmss:

moment("123", "hmm").format("HH:mm") === "01:23"moment("1234", "hmm").format("HH:mm") === "12:34"

通过moment.defaultFormat 可以设置默认格式化方式

默认的

moment("15", "hh").format();//"2020-02-04T15:00:00+08:00"

设置后

moment.defaultFormat = "YYYY-MM-DD HH:mm:ss"moment("15", "hh").format();// "2020-02-04 15:00:00"

所有的 moment 都是可变的。 假如想要克隆 moment,则可以隐式或者显式地操作。

在 moment 上调用 moment() 将会克隆它。

var a = moment([2012]);var b = moment(a);a.year(2000);b.year(); // 2012

通过clone

var a = moment([2012]);var b = a.clone();a.year(2000);b.year(); // 2012

Moment 的解析器非常宽松,使用时建议开启严格模式,及早发现问题

开启前

moment('2016 is a date', 'YYYY-MM-DD').format("YYYY-MM-DD HH:mm:ss");//"2016-01-01 00:00:00"

开启后

moment('2016 is a date', 'YYYY-MM-DD',true).format("YYYY-MM-DD HH:mm:ss");// "Invalid date"

不带参数调用方法会作为取值,而带参数调用则会作为 赋值。

moment().seconds();moment().seconds(50).format("YYYY-MM-DD HH:mm:ss");// "2020-02-04 11:14:50"

假如数值超过当前单位,会向上一个单位冒泡哦

moment().seconds(150).format("YYYY-MM-DD HH:mm:ss");// "2020-02-04 11:19:30"

可以为负数

moment().seconds(-50).format("YYYY-MM-DD HH:mm:ss");"2020-02-04 11:15:10"

格式化

format 链接

key意思输出
YY年份70 71 … 29 30
M月份1 2 … 11 12
D日期1 2 … 30 31
H小时0 1 … 22 23
h小时1 2 … 11 12
m分钟0 1 … 58 59
s0 1 … 58 59
S毫秒0 1 … 8 9
d星期0 1 … 5 6
Q季度1 2 3 4
A子午线AM PM
a子午线am pm
w年份的星期1 2 … 52 53

转义格式字符串中的字符

moment().format('[今天] dddd'); // '今天 Sunday'

与当前时间的关系

fromNow

moment([2007, 0, 29]).fromNow(); // "13 years ago"moment([2007, 0, 29]).fromNow(true); // "13 years"
moment().toNow()// "a few seconds ago"moment().toNow(Boolean);// "a few seconds"

两个时间的关系

var a = moment([2007, 0, 28]);var b = moment([2007, 0, 29]);a.from(b); "a day ago"
var a = moment([2007, 0, 28]);var b = moment([2007, 0, 29]);a.to(b)"in a day"

calendar

链接

moment().calendar();// "Today at 2:37 PM"

同时支持少量判定API isBeforeisSameisAfterisSameOrBeforeisSameOrAfterisBetween

对于时长的形容

moment.duration(1, "minutes").humanize();// "a minute"moment.duration(1, "minutes").humanize(true); // "in a minute"

对时间的操作

moment().add(Number, String);moment().add(Duration);moment().add(Object);
moment().add(7, 'd');

减去API: subtract

moment().startOf(String);
moment().startOf('year');    // 设置为今年一月1日上午 12:00moment().startOf('month');   // 设置为本月1日上午 12:00

结束API: endOf

key缩写
yearsy
quartersQ
monthsM
weeksw
daysd
hoursh
minutesm
secondss
millisecondsms

调试

验证时间的有效性

isValid()

moment([2015, 25, 35]).isValid();// false

parsingFlags 返回一个对象

moment([2015, 25, 35]).parsingFlags();

image.png

通过invalidAt 确认那个单位无效

moment([2015, 25, 35]).invalidAt();// 1
数字单位
0年份
1月份
2日期
3小时
4分钟
5秒钟
6毫秒

得到创立moment时的输入

moment("2013-01-02", "YYYY-MM-DD", true).creationData() 

image.png

转换

得到js的Date 对象

moment().toDate();

得到数组形式

moment().toArray();//[2020, 1, 4, 14, 3, 25, 481]

得到对象形式

moment().toObject();

image.png

时长

链接

默认毫秒

moment.duration(100).milliseconds();// 100

支持传单位

moment.duration(2, 'seconds').seconds();

更准确的转换

moment.duration(15001).asSeconds(); // 15.001
key缩写
yearsy
monthsM
weeksw
daysd
hoursh
minutesm
secondss
millisecondsms

可直接传递对象

moment.duration({    seconds: 2,    years: 2});

支持传递字符串形式

moment.duration('23:59:59');

很对用于操作moment的API对duration也生效

进阶

解析字符串

原文
当从字符串创立 moment 时,需要首先检查字符串能否与已知的 ISO 8601 格式匹配,假如未找到已知的格式,则在降维到 new Date(string) 之前检查字符串能否与 RFC 2822 日期时间格式匹配,浏览器对于解析字符串的支持是不一致的

webpack打包

webpack 会打包所有的 Moment.js 语言环境,优化可看

插件

round 对时间四舍五入

m.round(5, 'seconds'); // 2015-06-18 15:30:20m.ceil(3, 'minutes'); // 2015-06-18 15:33:00m.floor(16, 'hours'); // 2015-06-18 00:00:00

地址.

说明
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » Moment-基本概念篇

发表回复