JavaScript new Date()在Safari上的坑

問題描述

  • 我們經常用yyyy-MM-dd HH:mm:ss格式表示日期,如2018-11-11 00:00:00,在js開發中也經常會把此格式字符串格式化為javascript Date類型,如new Date('2018-11-11 00:00:00'),不幸的是此操作在Safari瀏覽器(不論是Mac還是iPhone)上會報錯,返回Invalid Date。如下圖所示
    在Mac Safari控制臺執行

解決問題

  • 所以在new Date('yyyy-MM-dd HH:mm:ss')格式化前需要先把字符串轉化為Safari支持的格式,可以是yyyy/MM/dd HH:mm:ssyyyy-MM-ddTHH:mm:ss或其他。看下圖
new Date('2018-11-11 00:00:00'.replace(/-/g, "/"))
new Date('2018-11-11 00:00:00'.replace(/ /g,"T"))
在Mac Safari控制臺執行
  • 注:又由于IE8上根本不支持-分割的日期,所以這里建議用/分割日期字符串,你也可以不考慮IE8
new Date('2018-11-11 00:00:00'.replace(/-/g, "/"))
在IE瀏覽器控制臺執行

終極方案

  • 每次new Date需要replace感覺很麻煩,所以這里給出一個終極方案,就是修改全局的Date的默認行為,修改后當調用new Date時會先格式化
     /**
     * 在Safari和IE8上執行 new Date('2017-12-8 11:36:45'); 會得到Invalid Date
     * 本函數重寫默認的Date函數,以解決其在Safari,IE8上的bug
     */
    Date = function (Date) {
      MyDate.prototype = Date.prototype;
      return MyDate;

      function MyDate() {
        // 當只有一個參數并且參數類型是字符串時,把字符串中的-替換為/
        if (arguments.length === 1) {
          let arg = arguments[0];
          if (Object.prototype.toString.call(arg) === '[object String]' && arg.indexOf('T') === -1) {
            arguments[0] = arg.replace(/-/g, "/");
            // console.log(arguments[0]);
          }
        }
        let bind = Function.bind;
        let unbind = bind.bind(bind);
        return new (unbind(Date, null).apply(null, arguments));
      }
    }(Date);
  • 如下圖執行修改Date的方法后,正常使用new Date('2018-11-11 00:00:00')將不再報Invalid Date

    在Mac Safari控制臺執行

  • 注:這段代碼應該放在所有new Date操作之前,如html的<head>中,如下圖是我在ionic項目中的配置位置

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • ORACLE日期時間函數大全 TO_DATE格式(以時間:2007-11-02 13:45:25為例) Year:...
    雨一流閱讀 685評論 0 2
  • 在日常開發中,有時需要將服務端返回的日期字符串進行date對象轉換。比較常見的日期字符串格式是"yyyy-MM-d...
    不要叫我帥哥閱讀 1,836評論 0 1
  • 夜游中大 話說:愛上一座城,就會愛上一個人,而愛上一個人,就會愛上有他/她的一座城。廣州,斷斷續續待了快五年了...
    斯禪閱讀 360評論 0 1
  • 你的美 讓所有人迷醉 而我,也不能例外 讓所有人在夢里飄蕩起飛 每一秒的富有還是窮困 每一步的光亮還是潦倒 總會,...
    何天之衢閱讀 342評論 1 1