往String原型上封装一个时间戳转日期的方法

小彭的前端成长日记丶

已于 2022-04-18 01:14:14 修改

阅读量403

点赞数

文章标签： javascript

于 2022-04-18 01:07:54 首次发布

本文链接：https://blog.csdn.net/qq_60248719/article/details/124240076

版权

刚在学习React教程，里面有一节讲DOM的diffing算法的，老师的例子里面有展示当前时间的，但是他并没有完整的展示出来，而是用的 toTimeString() ，而我之前有封装过这个方法：时间戳转格式化日期

用的时候我转念一想，这样封装的话它是一个函数，能不能像 toTimeString 这样封装到字符串身上呢？说干就干，随手在浏览器控制台敲出如下代码：

String.prototype.toDate = function(){
    ???
}

突然懵逼，我该怎么拿到值？？

正常的函数调用可以通过形参拿值，但我这是点出来的方法啊，那既然是点出来的，函数作用域中的this是不是就是这个函数的调用者也就是这个字符串呢？

但是它现在变成了this，我又该怎么获取到它原来的值呢？不用多想，它身上肯定会有什么原生的方法可以拿到它的值，旋即敲出如下代码：

String.prototype

不出所料，在原型的一堆属性和方法上发现了一个很可疑的家伙——valueOf

'123'.valueOf() // '123'

那么拿值的难题就解决了！！剩下的就是把之前的代码拷过来稍微改一下就行了

String.prototype.toDate = function () {
      var date = new Date(Number(this.valueOf().length == 13 ? this.valueOf() : this.valueOf() + '000'));
      let Y = date.getFullYear() + '-';
      let M = (date.getMonth() + 1).toString().padStart(2, '0') + '-';
      let D = (date.getDate()).toString().padStart(2, '0') + ' ';
      let h = (date.getHours()).toString().padStart(2, '0') + ':';
      let m = (date.getMinutes()).toString().padStart(2, '0') + ':';
      let s = (date.getSeconds()).toString().padStart(2, '0');
      return Y + M + D + h + m + s;
    }

这样以后就可以快乐的点出格式化时间啦 ~·o·~

当然，Number类型的需要先转化一下，就不给Number原型再来一套了