遇到的時間資料的處理方式記錄

我在做一個原生時間軸的需求中，遇到了接口資料的處理部分，場景為發生或結束事件的時間處理，需要依據接口時間制作時間軸刻度，其中接口資料所有時間的年月日時範圍不确定，是以，就引發了一系列時間處理。并在項目組的CodeReview中，改進了處理方案。

1. 時間資料本身的處理

   傳回接口中包含的時間格式是醬紫的：2019-06-19 10:19:10，根據項目實際情景，我需要年、月、日、時，分，秒，代碼未review之前是醬紫處理的：（用例子說明吧，這樣的代碼太繁瑣啦）

   let time = "2019-06-19 15:19:09";
   console.log(time.toString().split('-')[0]); // 2019
   console.log(time.toString().split('-')[1]); // 06
   console.log(time.toString().split('-')[2].split(' ')[0]); // 19
   console.log(new Date(time).toTimeString().split(' ')[0]); //15:19:09
   console.log(new Date(time).toTimeString().split(' ')[0].split(':')[0]); // 15時
   console.log(new Date(time).toTimeString().split(' ')[0].split(':')[1]); // 19分
   console.log(new Date(time).toTimeString().split(' ')[0].split(':')[2]); // 09秒
              

   嗯~~大概就是用到了這些，多整齊呀，但……并不是最好的方式，時刻要謹記有麼有更好的工具或者方法，然後，去補充了moment.js官網，各種處理時間的方法及情況，啥啥都有，貌似足夠解決所有的情況了吧。

   于是，review之後，修改了代碼：（例子說明~）

   let time = "2019-06-19 15:19:09";
   console.log('年：' + this.$moment(time).year());
   console.log('月：' + this.$moment(time).month());
   console.log('日：' + this.$moment(time).date()); // 注意不是day!
   console.log('小時：' + this.$moment(time).hour());
   console.log('分鐘：' + this.$moment(time).minute());
   console.log('秒：' + this.$moment(time).second());
              

   額~~發現一個問題，moment中的月份輸出是5，明明是6月，怎麼小1呢？在其他方法中也遇到了：

   console.log(this.$moment(time).toArray());
   console.log(this.$moment(time).toObject());
              

   上面處理後的時間中的月份也是小1，暈，後來自習閱讀官方文檔後，月份在有些方法中确實是小1，好吧，目前我遇到過的是month()、toArray()、toObject().

   言歸正傳吧，當然也可以使用toArray()轉化為數組，然後按順序取值~

2. 計算兩個時間戳的時間差、時間段内的最大值最小值

   review之前，方法很原生，由于實際情況中需要計算最小機關為秒的時間差，是以類似這樣的代碼就出現了：

   let timeSum = (max - min) > 1 ? (max - min + 1) * 60 * 60 : 60 * 60;
              

   大概解釋下，我在幹啥吧，我是在計算一段總時間（秒），代碼主要實作集中于其他功能，起初的時間機關未處理完成，導緻出現* 60 * 60這種星星代碼（捂臉），這裡還有最大值和最小值的變量，代碼能實作不是最終目标，精煉實作才是最終目标，是以，moment用上吧：（還是舉例說明）

   // 計算時間差
   let timeStart = this.$moment('2019-06-19 10:19:10'); 
   let timeEnd = this.$moment('2019-06-19 15:19:09');
   let secondsSub = timeEnd.diff(timeStart, 'seconds'); // 秒 
   console.log(timeStart, timeEnd, 's ' + secondsSub, 'm ' + secondsSub / 60, 'h ' + secondsSub / 60 / 60);
              

   實際情況中，我展示的資料需要按天或者月展示的，是以需要判斷這些時間戳是否在一個時間次元中，這裡diff()方法還有一個注意點，我曾這樣寫過：

   // 計算時間差
   let timeStart = this.$moment('2019-06-19 10:19:10').format('HH:mm:ss'); 
   let timeEnd = this.$moment('2019-06-19 15:19:09').format('HH:mm:ss');
   let secondsSub = timeEnd.diff(timeStart, 'seconds');
   console.log(timeStart, timeEnd, 's ' + secondsSub, 'm ' + secondsSub / 60, 'h ' + secondsSub / 60 / 60);
              

   嗯……原本我是想格式化一下，過濾掉日期計算時間差，然後diff()方法就報錯了……大家這樣用的時候注意些。最後是最值的問題（最費時的是自己寫一個最值函數，裡面再加一次排序？非常非常不必要，這些算法可以在面經中展示，實際代碼中還是找現成的，好處你懂得），也可以利用moment實作：

   let timeStart = this.$moment('2019-06-19 10:19:10'); 
   let timeEnd = this.$moment('2019-06-19 15:19:09');
   console.log(this.$moment.max(timeStart, timeEnd));
              

   這裡需要注意下最值函數參數的時間格式，我這裡是24小時制的。

   關于時間資料處理這部分暫時總結這麼多吧，以後如果再遇到問題繼續補充，目前看來，全部換成moment工具，代碼量少很多（代碼中将moment引入時設定為全局變量了），看起來精簡好多，關于moment的其他用法可以參考下它的官網，很全很全。

   以上内容為本次分享，歡迎大咖前來指教補充！