从时间控件到js时间的学习~~

1,009 阅读3分钟

一:几种不同的时间格式:

1. GMT+0800 

当我们new Date() 的时候:

let date = new Date();

console.log(date);       //  Fri Sep 25 2020 17:28:26 GMT+0800 (中国标准时间)

这个格式不是我们常见的" XXXX-XX-XX " 时间格式,那这是个什么鬼?

其实GMT+0800 是格林尼治时间,具体什么是意思,不用管他,我们知道的是,对与前端而言,这个格式不能用来展示,也不能用来判断。

2.格式时间:

我们都习惯于这种格式: "2020-10-01 16:00:00" 。

前端有专门的规定来约束这样的时间格式:比如Format函数中用于格式化 日期时间的字符。

yyyy : 以四位数字格式显示年份

MM: 将月份显示为带前导零的数字

dd: 将日显示为带前导零的数字

等等,可以根据不同的时间格式展示不同的时间结果。

3. UTC时间:

这个是时间统一时间,没有划定时区的时间。我最近的几个需求,后端返回的时间都是UTC时间,也是需要转化的。

4. 时间戳:

时间戳就是毫秒数,用毫秒数来表示时间,可以精确表示时间点,以及时间差点问题。

二: 时间格式之间的转化:

1. new Date() 的一些常用的api:

let newDate = new Date();

newDate.getFullYear();                       // 获取年数

newDate.getMonth();                         //获取月数:(0 -11) 表示12个月

newDate.getTime();                             // 获取毫秒数, 也就是时间戳

newDate.toLocaleString();                 // "2020/9/25 下午5:50:54"

newDate.toLocaleDateString();          //"2020/9/25"

newDate.toGMTString();                  // "Fri, 25 Sep 2020 09:50:54 GMT"

newDate.toLocaleTimeString();        //   "下午5:50:54"

newDate.getDate();                          // 获取日期

newDate.getDay();                           // 获取星期(0 表示星期天)

2. new Date() 的参数问题:

1、new Date("month dd,yyyy hh:mm:ss");     

2、new Date("month dd,yyyy");

3、new Date(yyyy,mth,dd,hh,mm,ss); 注意:这种方式下,必须传递整型

4、new Date(yyyy,mth,dd);

5、new Date(ms);          // 传的是时间戳

栗子:

new Date("Jun 2,2017 12:00:00"); //Fri Jun 02 2017 12:00:00 GMT+0800 (中国标准时间)
new Date("Jun 2,2017"); //Fri Jun 02 2017 00:00:00 GMT+0800 (中国标准时间)
new Date(2017,5,2,12,0,0); //Fri Jun 02 2017 12:00:00 GMT+0800 (中国标准时间)
new Date(2017,5,2); //Fri Jun 02 2017 00:00:00 GMT+0800 (中国标准时间)
new Date(1496376000000); //Fri Jun 02 2017 12:00:00 GMT+0800 (中国标准时间)

3.字符串形式的日期转换成日期对象:

let str = "2020-9-25";

let newDate = new Date(Date.parse(str.replace(/-/g, '-')));    //Fri Sep 25 2020 00:00:00 GMT+0800 (中国标准时间)

4. 日期格式转为日期标准字符串:

let newDate = new Date();

let formData = (data) => {

let yy = date.getFullYear();

let mm = date.getMonth() + 1;

mm = mm < 10 ?  '0' + mm : mm;           // 显示为01,02 

let dd = dd < 10 ? '0' + dd : dd;

return ${yy}-${mm}-${dd};

};

5. 时间戳转为日期格式:

let formatDate = (time, format) => {    let time = new Date(time);    let timeTemp = (i) => {         return (i < 10 ? '0' : '') + i    };    return format.replace(/yyyy|MM|dd|HH|mm|ss/g, (a) => {        switch(a) {            case 'yyyy':            return timeTemp(time.getFullYear());            break;            case 'MM':            return timeTemp(time.getMonth() + 1);            break;            case 'mm':            return timeTemp(time.getMinutes());            break;            case 'dd':            return timeTemp(time.getDate());            break;            case 'HH':            return timeTemp(time.getHours());            break;            case 'ss':            return timeTemp(time.getSeconds());            break;        }    })};  

解释一下代码哈: 主要是通过replace函数来匹配对应的字段,然后获取不同的对应年月日。

三.其他一些比较常用的方法:

1.获取前一天和后一天的时间。

function getBeforeDate() {    // 获取前一天时间    let dateTime = new Date();    dateTime = dateTime.setDate(dateTime.getDate() - 1);    return new Date(dateTime);}function getAfterDate() {    // 获取后一天时间    let dateTime = new Date();    dateTime = dateTime.setDate(dateTime.getDate() + 1);    return new Date(dateTime);}

2. 固定时间时分秒格式:

export function localTime(timeDay) {    // 把时间格式固定为: 16:00:00    const date = timeDay.getFullYear() + '-' + (timeDay.getMonth() + 1) + '-' + timeDay.getDate();    return new Date(`${date} 16:00:00`);}