iOS格式化時間NaN問題

問題

我們再做移動端頁面時經常會遇到需要格式化時間的問題，但是有時安卓端和iOS對時間的表現卻不一樣，在iOS端有時會出現NaN的現象，而安卓端卻沒有問題。

表現

我們先寫一個格式化代碼的方法：

//格式化時間
  var formattingDate =  function(timedata) {
      var date = new Date(timedata);
      var Year = date.getFullYear();
      var Month = date.getMonth() + 1 < 10 ? "0"+(date.getMonth()+1) : date.getMonth()+1;
      var d = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
      var Hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
      var Minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
      var Seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
      return (Year + "-" + Month + "-" + d + " " + Hours + ":" + Minutes + ":" + Seconds);
  }

然後我們分別在chrome和Safari中運行，傳入相同的入參，觀察返回值：

由上圖可見當我們的格式化方法的入參是使用-來鏈接時，就有可能會出現兩端表現不一致的現象。

解決方法

我們可以使用正則表達式將入參的連接方式替換/,來對我們的格式化方法進行強化：

//格式化時間
  var formattingDate =  function(timedata) {
      var date = new Date(timedata.replace(/-/g, '/'));
      var Year = date.getFullYear();
      var Month = date.getMonth() + 1 < 10 ? "0"+(date.getMonth()+1) : date.getMonth()+1;
      var d = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
      var Hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
      var Minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
      var Seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
      return (Year + "-" + Month + "-" + d + " " + Hours + ":" + Minutes + ":" + Seconds);
  }

這樣，我們的方法就不會出現兩端格式化不一致的情況了。

歡迎大家關注、分享、點贊哦！