JavaScript 日期处理类库: Moment.js 写法示例(详解)

主页:http://momentjs.cn/

文档:http://momentjs.cn/docs/

项目地址:https://github.com/moment/moment/

下载:moment-develop

引用:

http://sources.ikeepstudying.com/js/moment-2.10.6.js  (未压缩)

http://sources.ikeepstudying.com/js/moment.min-2.18.1.js (压缩版)

http://sources.ikeepstudying.com/js/moment-with-locales-2.10.6.js (支持多语言)

 

1. 安装

bower install moment --save # bower
npm install moment --save   # npm
Install-Package Moment.js   # NuGet
spm install moment --save   # spm
meteor add momentjs:moment  # meteor

 

2. 创建

moment() // 当前时间
moment("1995-12-25") // 1995-12-25
moment("12-25-1995", "MM-DD-YYYY") // 1995-12-25
moment({ year :2010, month :3, day :5, hour :15, minute :10, second :3, millisecond :123})
moment(Date.now() - 24 * 60 * 60 * 1000) // 昨天
moment(new Date(2011, 9, 16)) // 2011-10-16

 

3. 日期格式化

moment().format('MMMM Do YYYY, h:mm:ss a'); // 十月 23日 2017, 10:06:29 上午
moment().format('dddd');                    // 星期一
moment().format("MMM Do YY");               // 10月 23日 17
moment().format('YYYY [escaped] YYYY');     // 2017 escaped 2017
moment().format();                          // 2017-10-23T10:06:29-07:00
moment().format();                                // "2018-01-16T08:02:17-05:00" (ISO 8601)
moment().format("dddd, MMMM Do YYYY, h:mm:ss a"); // "Sunday, February 16th 2018, 3:25:50 pm"
moment().format("ddd, hA");                       // "Sun, 3PM"
moment('gibberish').format('YYYY MM DD');         // "Invalid date"
标识 输出
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
Q 1 2 3 4
天数(月) D 1 2 … 30 31
Do 1st 2nd … 30th 31st
DD 01 02 … 30 31
天数(年) DDD 1 2 … 364 365
DDDo 1st 2nd … 364th 365th
DDDD 001 002 … 364 365
Day of Week 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
星期(本地) e 0 1 … 5 6
星期(ISO) E 1 2 … 6 7
周数 w 1 2 … 52 53
wo 1st 2nd … 52nd 53rd
ww 01 02 … 52 53
周数(ISO) W 1 2 … 52 53
Wo 1st 2nd … 52nd 53rd
WW 01 02 … 52 53
YY 70 71 … 29 30
YYYY 1970 1971 … 2029 2030
周、年 gg 70 71 … 29 30
gggg 1970 1971 … 2029 2030
周、年(ISO) GG 70 71 … 29 30
GGGG 1970 1971 … 2029 2030
AM/PM A AM PM
a am pm
H 0 1 … 22 23
HH 00 01 … 22 23
h 1 2 … 11 12
hh 01 02 … 11 12
m 0 1 … 58 59
mm 00 01 … 58 59
s 0 1 … 58 59
ss 00 01 … 58 59
分数秒 S 0 1 … 8 9
SS 00 01 … 98 99
SSS 000 001 … 998 999
SSSS … SSSSSSSSS 000[0..] 001[0..] … 998[0..] 999[0..]
时区 z or zz EST CST … MST PST
注意: 自 1.6.0版本后,z/zz格式标识不再支持 查看详细
Z -07:00 -06:00 … +06:00 +07:00
ZZ -0700 -0600 … +0600 +0700
UNIX时间戳(秒级) X 1360013296
NIX时间戳(毫秒级) x 1360013296123

 

4. 相对时间

moment("20111031", "YYYYMMDD").fromNow(); // 6 年前
moment("20120620", "YYYYMMDD").fromNow(); // 5 年前
moment().startOf('day').fromNow();        // 10 小时前
moment().endOf('day').fromNow();          // 14 小时内
moment().startOf('hour').fromNow();       // 7 分钟前

一个通用的显示时间的方法moment.fromNow,它会调用多久之前时间或相对时间。

moment([2008, 0, 29]).fromNow(); // 10年前

如果设置为true,会得到一个不含后缀的值:

moment([2008, 0, 29]).fromNow(); // 10年前
moment([2008, 0, 29]).fromNow(true); // 10年

下面是一些用于输出时间范围的标识字符:

范围 标识 输出
0 – 45 秒 s a few seconds ago
45 – 90 秒 m a minute ago
90 秒 – 45 分 mm 2 minutes ago … 45 minutes ago
45 – 90 分 h an hour ago
90 分 22 小时 hh 2 hours ago … 22 hours ago
22 – 36 小时 d a day ago
36 小时 – 25 天 dd 2 days ago … 25 days ago
25 – 45 天 M a month ago
45- 345 天 MM 2 months ago … 11 months ago
345 – 545 天 (1.5 年) y a year ago
546 天+ yy 2 years ago … 20 years ago

 

时差 (之前)

moment().from(Moment|String|Number|Date|Array);
moment().from(Moment|String|Number|Date|Array, Boolean);

如果你想显示一个moment时间与另一个的关系,可以使用moment().from()方法:

var a = moment([2018, 0, 28]);
var b = moment([2018, 0, 29]);
a.from(b) // "a day ago"-1天前

第一个参数可以是任何形式的,可是一个momnet(),可也是一个真实的时间:

var a = moment([2018, 0, 28]);
var b = moment([2018, 0, 29]);
a.from(b);                     // "a day ago"
a.from([2018, 0, 29]);         // "a day ago"
a.from(new Date(2018, 0, 29)); // "a day ago"
a.from("2018-01-29");          // "a day ago"

moment().from()一样,也可以设置第二个参数为true,然后得到一个不含后缀的值。这在显示两个时间之间的时差时,非常有用:

var start = moment([2018, 0, 5]);
var end   = moment([2018, 0, 10]);
end.from(start);       // "in 5 days"
end.from(start, true); // "5 days"

 

时差 (之后,相对于现在时间)

moment().toNow();
moment().toNow(Boolean);

一个通用的显示时间的方法moment().toNow(),它会调用多久之后的时间或相对时间。

这与momoent().fromNow相似,a.fromNow() = - a.toNow()

这与momoent().to也相似,但moment().toNow是与当前时间做比较。

moment([2008, 0, 29]).toNow(); // in 10 years

设置第二个参数为true,可以得到一个不含后缀的值:

moment([2008, 0, 29]).toNow();     // in 10 years
moment([2008, 0, 29]).toNow(true); // 10 years

下面是一些用于输出时间范围的标识字符:

范围 标识 输出
0 – 45 秒 s in seconds
45 – 90 秒 m in a minute
90 秒 分 45 秒 mm in 2 minutes … in 45 minutes
45 – 90 分 h in an hour
90 分 – 22 小时 hh in 2 hours … in 22 hours
22 – 36 小时 d in a day
36 小时 – 25 天 dd in 2 days … in 25 days
25 – 45 天 M in a month
45 – 345 天 MM in 2 months … in 11 months
345 – 547 天 (1.5 年) y in a year
548 天+ yy in 2 years … in 20 years

 

时差 (之后)

moment().to(Moment|String|Number|Date|Array);
moment().to(Moment|String|Number|Date|Array, Boolean);

如果你想显示一个moment时间与另一个的关系,可以使用moment().to()方法:

var a = moment([2018, 0, 28]);
var b = moment([2018, 0, 29]);
a.to(b) // "in a day"

第一个参数可以是任何形式的,可是一个momnet(),可也是一个真实的时间:

var a = moment([2018, 0, 28]);
var b = moment([2018, 0, 29]);
a.to(b);                     // "in a day"
a.to([2018, 0, 29]);         // "in a day"
a.to(new Date(2018, 0, 29)); // "in a day"
a.to("2018-01-29");          // "in a day"

moment().from()一样,也可以设置第二个参数为true,然后得到一个不含后缀的值:

var start = moment([2007, 0, 5]);
var end   = moment([2007, 0, 10]);
end.to(start);       // "5 days ago"
end.to(start, true); // "5 days"

 

5. 日历时间

moment().subtract(10, 'days').calendar(); // 2017年10月13日
moment().subtract(6, 'days').calendar();  // 上周二上午10点07
moment().subtract(3, 'days').calendar();  // 上周五上午10点07
moment().subtract(1, 'days').calendar();  // 昨天上午10点07分
moment().calendar();                      // 今天上午10点07分
moment().add(1, 'days').calendar();       // 明天上午10点07分
moment().add(3, 'days').calendar();       // 本周四上午10点07
moment().add(10, 'days').calendar();      // 2017年11月2日
moment().calendar();
moment().calendar(referenceTime);
moment().calendar(referenceTime, formats);  // from 2.10.5

日历时间用于显示参考时间referenceTime(默认为现在时间),但不moment().fromNow()有所有不同。

moment().calendar()会用跟据传入字符串的不同按不同的格式输出。

 

6. 多语言支持

moment().format('L');    // 2017-10-23
moment().format('l');    // 2017-10-23
moment().format('LL');   // 2017年10月23日
moment().format('ll');   // 2017年10月23日
moment().format('LLL');  // 2017年10月23日上午10点07分
moment().format('lll');  // 2017年10月23日上午10点07分
moment().format('LLLL'); // 2017年10月23日星期一上午10点07分
moment().format('llll'); // 2017年10月23日星期一上午10点07分

 

本地化格式

因为不同地区的首选格式不同,这里还提供了一些特殊标识时用于moment的本地格式化。在这些格式中,格式标识大小写作用相同:

时间 LT 8:30 PM
时间和秒 LTS 8:30:25 PM
数字月、日、年 L 09/04/1986
l 9/4/1986
月名、日、年 LL September 4 1986
ll Sep 4 1986
月名、日、年、时间 LLL September 4 1986 8:30 PM
lll Sep 4 1986 8:30 PM
月名、日、星期、年、时间/b> LLLL Thursday, September 4 1986 8:30 PM
llll Thu, Sep 4 1986 8:30 PM

 

 

义字符

在格式化字符串,如果包括转义字符,可以将其用方括号包起来:

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

 

7. 获取/设置时间信息

moment().second() //获得 秒
moment().second(Number) //设置 秒。0 到 59
moment().minute() //获得 分
moment().minute(Number) //设置 分。0 到 59
// 类似的用法
moment().hour() // 小时
moment().date() // 一个月里的第几天
moment().day() // 星期几
moment().dayOfYear() // 一年里的第几天
moment().week() // 一年里的第几周
moment().month() // 第几个月
moment().quarter() // 一年里的第几个季度
moment().year() // 年
moment().daysInMonth() // 当前月有多少天

 

8. 操作

moment().add(7, 'days') // 之后的第7天。第2个参数还可以是 'months', 'years' 等。注意是复数。
moment().add(7, 'd')// 与上面一行代码的运行结果一样。
moment().subtract(1, 'months') // 上个月

moment().startOf('week') // 这周的第一天
moment().startOf('hour') // 等效与 moment().minutes(0).seconds(0).milliseconds(0)。
// 还支持 'year','month' 等

moment().endOf('week')

 

9. 查询

// 早于
moment('2010-10-20').isBefore('2010-10-21') // true
moment('2010-10-20').isBefore('2010-12-31', 'year') // false
moment('2010-10-20').isBefore('2011-01-01', 'year') // true

// 是否相等
moment('2010-10-20').isSame('2010-10-20') // true
moment('2010-10-20').isSame('2009-12-31', 'year')  // false
moment('2010-10-20').isSame('2010-01-01', 'year')  // true

// 晚于
moment('2010-10-20').isAfter('2010-10-19') // true
moment('2010-10-20').isAfter('2010-01-01', 'year') // false
moment('2010-10-20').isAfter('2009-12-31', 'year') // true

// 是否在时间范围内
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('2010-10-20').isBetween('2009-12-31', '2012-01-01', 'year') // true

moment().isLeapYear() // 是否是闰年

 

10. 时差 (毫秒)

moment().diff(Moment|String|Number|Date|Array);
moment().diff(Moment|String|Number|Date|Array, String);
moment().diff(Moment|String|Number|Date|Array, String, Boolean);

获取一个毫秒级的时差,moment().diff()方法类似于moment().from()方法。
var a = moment([2007, 0, 29]);
var b = moment([2007, 0, 28]);
a.diff(b) // 86400000

如果需要获取其它单位的时间,可以在调用方法时传入第二个参数:

var a = moment([2007, 0, 29]);
var b = moment([2007, 0, 28]);
a.diff(b, 'days') // 1

月和年的时差

moment().diff()方法对月和年做了特殊处理,如果两个月分的日期一至,总是返回一个整数,所以:

1月15 和2月15,会是1个月

2月28 和3月28,会是一个月

2011年2月28和2012年2月28,会是一年

 

11. Unix 偏移量 (毫秒)

moment().valueOf();
+moment();
moment().valueOf()会简单的输出一个毫秒级的Unix时间偏移量,类似于Date.valueOf()。
moment(1318874398806).valueOf(); // 1318874398806
+moment(1318874398806); // 1318874398806

 

12. Unix 时间戳 (秒)  timestamp to date

moment().unix();
moment().unix()会返回一个Unix时间戳。
moment(1318874398806).unix(); // 1318874398

转换时间戳为日期
moment.unix(value).format("MM/DD/YYYY");

 

13. 天数 (月)

moment().daysInMonth();

获取当前月的天数。

moment("2018-02", "YYYY-MM").daysInMonth() // 29
moment("2018-01", "YYYY-MM").daysInMonth() // 31

 

14. JavaScript Date对象

moment().toDate();

通过Moment.js获取一个JavaScript Date对象,使用moment().toDate()方法。

将要返回的Datemoment正在使用的对象,所以任何对Date的修改也会导致moment改变。如果你只想获取一个Date副本,应该在调用moment().toDate()方法前使用moment().clone()方法。

 

15. 数组

moment().toArray();

返回一个数组,返回值是new Date()参数的镜像。

moment().toArray(); // [2018, 1, 4, 14, 40, 16, 154];

 

16. JSON

moment().toJSON();

将一个对象序列成JSON,如果是一个Moment对象,将按ISO8601格式抬字符串,否则按UTC返回。

JSON.stringify({
    postDate : moment()
}); // '{"postDate":"2013-02-04T22:44:30.652Z"}'

 

17. ISO 8601 字符串

moment().toISOString();

格式化成一个ISO 8601标准的字符串:

moment().toISOString() // 2018-02-04T22:44:30.652Z

 

18. 对象

moment().toObject();

返回一个包括:年、月、日、时、分、秒、毫秒的对象

moment().toObject()  // {
                     //     years: 2015
                     //     months: 6
                     //     date: 26,
                     //     hours: 1,
                     //     minutes: 53,
                     //     seconds: 14,
                     //     milliseconds: 600
                     // }

 

Moment Timezone

引用:

http://sources.ikeepstudying.com/js/moment-timezone.js  (moment-timezone.js)

http://sources.ikeepstudying.com/js/moment-timezone-with-data-2010-2020.js  (moment-timezone-with-data-2010-2020.js)

http://sources.ikeepstudying.com/js/moment-timezone-with-data.js  (moment-timezone-all-years.js)

Format Dates in Any Timezone

var jun = moment("2014-06-01T12:00:00Z");
var dec = moment("2014-12-01T12:00:00Z");

jun.tz('America/Los_Angeles').format('ha z');  // 5am PDT
dec.tz('America/Los_Angeles').format('ha z');  // 4am PST

jun.tz('America/New_York').format('ha z');     // 8am EDT
dec.tz('America/New_York').format('ha z');     // 7am EST

jun.tz('Asia/Tokyo').format('ha z');           // 9pm JST
dec.tz('Asia/Tokyo').format('ha z');           // 9pm JST

jun.tz('Australia/Sydney').format('ha z');     // 10pm EST
dec.tz('Australia/Sydney').format('ha z');     // 11pm EST

Convert Dates Between Timezones

var newYork    = moment.tz("2014-06-01 12:00", "America/New_York");
var losAngeles = newYork.clone().tz("America/Los_Angeles");
var london     = newYork.clone().tz("Europe/London");

newYork.format();    // 2014-06-01T12:00:00-04:00
losAngeles.format(); // 2014-06-01T09:00:00-07:00
london.format();     // 2014-06-01T17:00:00+01:00

 

本文:JavaScript 日期处理类库: Moment.js 写法示例

Loading

2 Comments

Add a Comment

Your email address will not be published. Required fields are marked *

Time limit is exhausted. Please reload CAPTCHA.