前端 - moment.js 学习笔记

本文链接： https://blog.csdn.net/kelly0721/article/details/102523677

一、使用方法

安装

通过 node.js 安装并使用

// 安装
npm install moment

// 使用，moment可直接调用
import moment from 'moment';
moment().format();

浏览器

// 官方
<script src="moment.js"></script>
<script>
    moment().format();
</script>
//
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script>
   console.log(moment());
</script>

如果想直接在html文件中使用moment，那么需要先引入moment.js文件，可以在 cdnjs 中获得最新的 moment.js 文件

二、解析

当前时间

moment();

调用moment(),不需要任何参数就可以创建当前时间的moment对象

字符串

moment("1995-12-25");

可以创建时间为传入参数的moment对象

字符串 + 格式

moment(String, String);
moment(String, String, String);
moment(String, String, Boolean);
moment(String, String, String, Boolean);
//
moment("12-25-1995", "MM-DD-YYYY");
moment("12/25/1995", "MM/DD/YYYY");
moment('2012 July',    'YYYY MMM', 'en');
moment('It is 2012-05-25', 'YYYY-MM-DD', true).isValid(); // false
moment('It is 2012-05-25', 'YYYY-MM-DD').isValid(); // true
moment('2012-05-25',       'YYYY-MM-DD', true).isValid(); // true

一开始没懂这个要怎么用，后来终于看懂了…

第一个参数代表着时间
第二个参数代表传入时间的格式
如，moment(“12-25-1995”, “MM-DD-YYYY”)，传了第二个参数之后，才能正确解析是 1995年12月25日，如果是 moment(“1995/12/25”, “YYYY/MM/DD”) ,也是因为有了第二个参数才能正确解析出 1995年12月25日
第三个参数就是代表着不同的语言
第四个参数代表着传入的字符格式是否要匹配第二个参数的格式，当传入ture，如果匹配的格式不对，那就是一个非法的moment对象，当传入的值为空或者false时，如果有非法字符但是时间格式匹配，那么还是可以解析，但是如果时间格式不匹配，那么解析出来的还是非法的moment对象

字符串 + 多个格式

moment("29-06-1995", ["MM-DD-YYYY", "DD-MM", "DD-MM-YYYY"]); // uses the last format
moment("05-06-1995", ["MM-DD-YYYY", "DD-MM-YYYY"]);          // uses the first format

和上面一样，传入多个解析的时间格式

对象

moment({unit: value, ...});
//
moment({ hour:15, minute:10 });

可以传入自定义的时间值来构建moment对象

Unix 偏移量 (毫秒)

var day = moment(1318781876406);

传入的值是13位的时间戳

Unix 时间戳 (秒)

var day = moment.unix(1318781876);

传入的值是10位的时间戳

Date 对象

var day = new Date(2011, 9, 16);
var dayWrapper = moment(day);

也可以传入Date对象

数组

[year, month, day, hour, minute, second, millisecond]
moment([2010, 1, 14, 15, 25, 50, 125]); // February 14th, 3:25:50.125 PM

可以传入数组

扫描二维码关注公众号，回复： 7646268 查看本文章

克隆

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

克隆moment对象

合法性校验

moment().isValid();

可以校验moment对象的合法性，根据以下几点判断是否合法

是否溢出：如一年的13月，一月的32号，一年的第376号等,溢出包含与#invalidAt匹配的无效单位的索引;-1表示没有溢出
无效的月份：一个无效的月份名称，例如 moment('Marbruary', 'MMMM');显示无效月份的字符串或者null
是否为空：传入的字符串是否都不可解析，例如moment('this isnonsense');Boolean
是否无输入：例如moment(null);Boolean
格式是否匹配：例如moment('2013-05-25', [])Boolean

var m = moment("2011-10-10T10:20:90");
m.isValid(); // false
m.invalidAt(); // 5 for seconds

可以用invalidAt 判断是那个时间单位出错了

默认值

moment(5, "HH");  // today, 5:00:00.000
moment({hour: 5});  // today, 5:00:00.000

给 moment对象设置默认值

三、取值/赋值

毫秒

moment().millisecond(Number);
moment().millisecond(); // Number

秒

moment().second(Number);
moment().second(); // Number

分钟

moment().minute(Number);
moment().minute(); // Number

小时

moment().hour(Number);
moment().hour(); // Number

日期

moment().date(Number);
moment().date(); // Number

范围从 1-31

星期

moment().day(Number|String);
moment().day(); // Number

取到当周、上周、下周的某个天
范围从 0-6
星期日是0

天

moment().dayOfYear(Number);
moment().dayOfYear(); // Number

周

moment().week(Number);
moment().week(); // Number

月

moment().month(Number|String);
moment().month(); // Number

范围从 0-11

季度

moment().quarter(); // Number
moment().quarter(Number);

范围从 1-4

年

moment().year(Number);
moment().year(); // Number

范围从 -270,000 - 270,000

周数

moment().weeksInYear();

*取值

moment().get('year');
moment().get('month');  // 0 to 11
moment().get('date');
moment().get('hour');
moment().get('minute');
moment().get('second');
moment().get('millisecond');

moment().get(unit) === moment()[unit]()

单位不区分大小写，并支持复数和缩写形式

赋值

moment().set(String, Int);
moment().set(Object(String, Int));

最大值

var a = moment().subtract(1, 'day');
var b = moment().add(1, 'day');
moment.max(a, b);  // b

最小值

var a = moment().subtract(1, 'day');
var b = moment().add(1, 'day');
moment.min(a, b);  // a

四、操作

Moment.js 提供了很多方法给用户执行各种操作，但要注意的是，这些操作都会改变原先的对象，如果你不想原先对象的值被改变，那么你要先克隆原先的对象

加法

moment().add(Number, String);  // moment().add(7, 'days');
moment().add(Duration); // moment().add(moment.duration({'days' : 1}));
moment().add(Object); // moment().add({days:7,months:1});

减法

moment().subtract(Number, String);
moment().subtract(Duration);
moment().subtract(Object);

开始时间

moment().startOf(String);
//
moment().startOf('year');    // set to January 1st, 12:00 am this year
moment().startOf('month');   // set to the first of this month, 12:00 am
moment().startOf('quarter');  // set to the beginning of the current quarter, 1st day of months, 12:00 am
moment().startOf('week');    // set to the first day of this week, 12:00 am
moment().startOf('isoWeek'); // set to the first day of this week according to ISO 8601, 12:00 am
moment().startOf('day');     // set to 12:00 am today
moment().startOf('hour');    // set to now, but with 0 mins, 0 secs, and 0 ms
moment().startOf('minute');  // set to now, but with 0 seconds and 0 milliseconds
moment().startOf('second');  // same as moment().milliseconds(0);

结束时间

moment().endOf(String);

最大值

moment().max(Moment|String|Number|Date|Array)
moment().max(moment().add(1, 'd')); // moment()

a.max(b)is the same as a = moment.min(a, b)(note that max is converted to min).
虽然看起来是取最大值，但实际上返回的是两个对象中更小的那个

最小值

moment().min(Moment|String|Number|Date|Array)
moment().max(moment().add(1, 'd')); // moment().add(1, 'd')

五、显示

格式化

moment().format(String)
moment().format('YYYY-MM-DD')

时差 (之前，现在为基准)

moment().fromNow();
moment().fromNow(Boolean);
//
moment([2007, 0, 29]).fromNow();     // 4 years ago
moment([2007, 0, 29]).fromNow(true); // 4 years // 如果是true，则没有后缀

时差 (之前)

moment().from(Moment|String|Number|Date|Array);
moment().from(Moment|String|Number|Date|Array, Boolean);
//
var a = moment([2007, 0, 28]);
var b = moment([2007, 0, 29]);
a.from(b) // "a day ago"

时差 (之后，现在为基准)

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

时差 (之后)

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

时差 (毫秒)

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

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

Unix 偏移量 (毫秒)

取13位的时间戳

moment().valueOf();

Unix 时间戳 (秒)

取10位的时间戳

moment().unix();

天数 (月)

moment().daysInMonth();

Date 对象

moment().toDate();

数组

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

JSON

moment().toJSON()

对象

moment().toObject();

六、查询

是否之前

moment().isBefore(Moment|String|Number|Date|Array);
moment().isBefore(Moment|String|Number|Date|Array, String);
// 
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#startOf一样，moment().isBefore也支持多个时间单位对比

是否相同

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

是否之后

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

是否之间

moment().isBetween(moment-like, moment-like);
moment().isBetween(moment-like, moment-like, String);
//
moment('2010-10-20').isBetween('2010-10-19', '2010-10-25'); // true

是否闰年

moment().isLeapYear();

是否 Moment 对象

moment.isMoment(obj);

是否 Date 对象

moment.isDate(obj);

六、时间段

创建

moment.duration(Number, String);
moment.duration(Number);
moment.duration(Object);
moment.duration(String);
//
moment.duration(100); // 100 milliseconds
moment.duration(2, 'seconds'); // 2000 milliseconds
moment.duration({ seconds: 2 }); 2000 milliseconds
moment.duration('0:0:2') // 2000 milliseconds

当调用 moment.duration() 时，是以毫秒作为时间单位，创建一个 moment
对象。
注意：如果传入的变量是毫秒数，类型要number，不能传 string

拟人化

moment.duration(1, "minutes").humanize(); // a minute
moment.duration(2, "minutes").humanize(); // 2 minutes
moment.duration(24, "hours").humanize();  // a day

自动换算单位

毫秒

moment.duration().milliseconds();
moment.duration().asMilliseconds();

moment.duration(500).milliseconds(); // 500
moment.duration(1500).milliseconds(); // 500
moment.duration(15000).milliseconds(); // 0

第一个值是500，因为创建出来的moment对象是 0小时0分0秒500毫秒
第二个值是500，因为创建出来的moment对象是 0小时0分1秒500毫秒
第三个值是0，因为创建出来的moment对象是 0小时0分15秒0毫秒
moment.duration().milliseconds() 返回的范围 0-999

moment.duration(500).asMilliseconds(); // 500
moment.duration(1500).asMilliseconds(); // 1500
moment.duration(15000).asMilliseconds(); // 15000

使用 moment.duration().asMilliseconds() 可以保留时间单位

秒

moment.duration().seconds();
moment.duration().asSeconds();

moment.duration(500).seconds(); // 0
moment.duration(1500).seconds(); // 1
moment.duration(15000).seconds(); // 15
//
moment.duration(500).asSeconds(); // 0.5
moment.duration(1500).asSeconds(); // 1.5
moment.duration(15000).asSeconds(); // 15

返回的范围 0-59

小时

moment.duration().hours();
moment.duration().asHours();

返回的范围 0-23

天

moment.duration().days();
moment.duration().asDays();

返回的范围 0-29

月

moment.duration().months();
moment.duration().asMonths();

返回的范围 0-11
注意：默认一个月有30天

年

moment.duration().years();
moment.duration().asDays();

注意：默认一年有365天

加法

moment.duration().add(Number, String);
moment.duration().add(Number);
moment.duration().add(Duration);
moment.duration().add(Object);
//
var a = moment.duration(1, 'd');
var b = moment.duration(2, 'd');
a.add(b).days(); // 3

减法

moment.duration().subtract(Number, String);
moment.duration().subtract(Number);
moment.duration().subtract(Duration);
moment.duration().subtract(Object);

转换单位

moment.duration().as(String);

const duration = moment.duration(97200000); // 1day3hour
duration.get('hours'); // 3
duration.as('hours'); // 27

默认得到的 moment对象是x小时x分x秒，一般只能取到他在对应单位的值，如果想取得该对象转化为某一单位的全部值，那么要调用该方法

取值

moment.duration().get(String);

Is a Duration

moment.isDuration(obj);
//
moment.isDuration() // false
moment.isDuration(new Date()) // false
moment.isDuration(moment()) // false
moment.isDuration(moment.duration()) // true
moment.isDuration(moment.duration(2, 'minutes')) // true

七、其他

无效对象

moment.invalid(Object);
//
var m = moment.invalid();
m.isValid();      // false
var m = moment();
m.isValid();      // true