前端 - moment.js 学习笔记

一、使用方法

安装

通过 node.js 安装并使用

// 安装
npm install moment

// 使用,moment可直接调用
import moment from 'moment';
moment().format();
浏览器
// 官方


//


如果想直接在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

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

  1. 第一个参数代表着时间
  2. 第二个参数代表传入时间的格式
    如,moment(“12-25-1995”, “MM-DD-YYYY”),传了第二个参数之后,才能正确解析是 1995年12月25日,如果是 moment(“1995/12/25”, “YYYY/MM/DD”) ,也是因为有了第二个参数才能正确解析出 1995年12月25日
  3. 第三个参数就是代表着不同的语言
  4. 第四个参数代表着传入的字符格式是否要匹配第二个参数的格式,当传入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

可以传入数组

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

克隆moment对象

合法性校验
moment().isValid();

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

  1. 是否溢出:如一年的13月,一月的32号,一年的第376号等,溢出包含与#invalidAt匹配的无效单位的索引;-1表示没有溢出
  2. 无效的月份:一个无效的月份名称,例如 moment('Marbruary', 'MMMM');显示无效月份的字符串或者null
  3. 是否为空:传入的字符串是否都不可解析,例如moment('this isnonsense');Boolean
  4. 是否无输入:例如moment(null);Boolean
  5. 格式是否匹配:例如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

你可能感兴趣的:(前端)