关于toLocaleDateString的坑

Date.prototype.toLocaleDateString 这个方法并不经常使用，可是不排除一些同窗会喜欢。笔者仍是奉劝这部分同窗戒掉这个方法吧。有时候被坑死了还不知道是什么状况。刚刚从坑里了爬出来，因此总结一下。

从一个真实的故事开始：

夏日的早晨，倒是很清爽。某程序员一觉醒来就收到测试报的一个问题，“页面怎么什么都不显示，js还报错了”。美好的早晨就此毁掉了...

????????????????

程序员表示一脸懵逼，心想，昨天不是还测试得好好的吗，页面也没有js报错，今天怎么就跪了？不科学呀，看看报错uncaught TypeError: cannot read property 'length' of undefined. 妈蛋，空指针， 必定是后台接口的问题。

说干就干，打开调试器一下接口请求，彻底没问题呀。什么鬼？

????????????????

因而开启js调试模式，看到错误报在一下这一段：

const dateTransform = date => {
    const tmp = date.split('\/');
    if (tmp[1].length !== 2) {
        tmp[1] = '0' + tmp[1];
    }
    if (tmp[2].length !== 2) {
        tmp[2] = '0' + tmp[2];
    }
    return tmp.join('-');
}

dateTransform(new Date().toLocaleDateString());

看到这段代码瞬间崩溃，怎么用这种方式处理时间显示 ????????????????
姑且认为某猿是加班到凌晨2点写的代码吧（同个物种之间要懂得体谅）。该猿的思路是转换形如"2017/5/12"这样的字符串为"2017-5-12"，讲道理能够跑起来的。可是为什昨天的代码，到了今天就没法执行了呢？必定是toLocaleDateString的问题。

笔者在firefox中执行了这一段代码，彻底正常，可是在chrome中报错。浏览器的问题？

# chrome
console.log(new Date().toLocaleDateString())
> 2017-5-12

#firefox
console.log(new Date().toLocaleDateString())
> 2017/5/12

哈哈哈哈，找到问题了，就是toLocaleDateString的坑。至于为何昨天能跑，今天不能跑，秒懂啦。chrome升级了。从57升级到了58。

#Chrome < 58
> new Date().toLocaleDateString()
> output: "2017/5/12"

#Chrome >= 58
> new Date().toLocaleDateString()
> output: "2017-5-12"

此猿想，这个问题也不能彻底把锅甩给chrome，dateTransform明显有问题啊，因而改：

const dateTransform = date => {
    const tmp = date.split('\/');
    if(tmp.length === 1){
        return date;
    }
    if (tmp[1].length !== 2) {
        tmp[1] = '0' + tmp[1];
    }
    if (tmp[2].length !== 2) {
        tmp[2] = '0' + tmp[2];
    }
    return tmp.join('-');
}

dateTransform(new Date().toLocaleDateString());

而后全世界清静了。
可是某猿思索片刻仍是果断删掉了这一段，用moment去实现Date格式化。

后记：

首先看看toLocaleDateString是什么东西：

toLocaleDateString() 方法返回该日期对象日期部分的字符串，该字符串格式因不一样语言而不一样。新增的参数 locales 和 options 使程序可以指定使用哪一种语言格式化规则，容许定制该方法的表现（behavior）。在旧版本浏览器中， locales 和 options 参数被忽略，使用的语言环境和返回的字符串格式是各自独立实现的。

from https://developer.mozilla.org...

这方法最大的问题是在不一样的浏览器中获得的结果是不同的，例如

# firefox
> new Date().toLocaleDateString()
> output: "2017/5/12"

#IE11
> new Date().toLocaleDateString()
> output: "2017-5-12"

#Chrome < 58
> new Date().toLocaleDateString()
> output: "2017/5/12"

#Chrome >= 58
> new Date().toLocaleDateString()
> output: "2017-5-12"

因此尽量不要用toLocaleDateString