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项目中的配置位置

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • ORACLE日期时间函数大全 TO_DATE格式(以时间:2007-11-02 13:45:25为例) Year:...
    雨一流阅读 750评论 0 2
  • 在日常开发中,有时需要将服务端返回的日期字符串进行date对象转换。比较常见的日期字符串格式是"yyyy-MM-d...
    不要叫我帅哥阅读 1,966评论 0 1
  • 夜游中大 话说:爱上一座城,就会爱上一个人,而爱上一个人,就会爱上有他/她的一座城。广州,断断续续待了快五年了...
    斯禅阅读 437评论 0 1
  • 你的美 让所有人迷醉 而我,也不能例外 让所有人在梦里飘荡起飞 每一秒的富有还是穷困 每一步的光亮还是潦倒 总会,...
    何天之衢阅读 373评论 1 1

友情链接更多精彩内容