js实现通用时间格式转换方法-逐梦个人博客

我们在平常写代码的过程中，经常会遇到格式化时间的需求，而且每次显示时间的格式还不一样，有的需要显示当前的时分，有的需要只需要显示年月日，就算只显示年月日，中间的间隔符还可能不一致，比如2019/04/08,2019-04-08,单位数是否要补0？年份显示在前面还是显示在后面？

一个简单的时间格式化需求充满了太多种可能，我们不可能为每一种格式的显示方式单独定义一个函数，那么我们就需要考虑使用一个通用的时间格式化函数，不管格式怎么变化，都能很好的支持，我们可以导入第三方库比如moment.js来实现，但是为了一个小需求导入一个大库不太划算，如果我们要自己实现一个怎么做呢？

const template = (template, data= {}) => {
  return template.replace(/<%=([^%]*)%>/g, function(s, m) {
    return data[m];
  });
};

上面定义了一个模板函数，代码很简单，也不难理解，主要就是利用正则表达式替换了一些特定标志位的值，但是他有什么用呢？比如我们要发起一个请求，但是每次请求的URL部分参数值不太一样，比如：

getList?page=1
getList?page=2

那么我们可以定义API模板为：

const API = 'getList?page=<%=page%>';

我们需要使用拿到真实的api的时候只需要调用:

const url = template(API, {
   page: 2
});

这种模板替换的方式应用还是挺广泛的，比如对于页面中需要动态插入的HTML，我们可以预先定义好待插入的HTML模板，每次插入前通过模板函数替换变化的值然后再插入就好，这样代码比较清晰，也比较好维护，再比如说POST请求中的变化URL也可以通过模板函数的方式实现。

在看完了模板函数后，我们可以按照同样的思维方式定义需动态替换的年月日时分秒的标志位，然后通过正则去动态替换这些特定的标志位就好了。实现的代码如下：

const format = (time, format = 'yyyy-mm-dd') => {
  const d = time ? new Date(time) : new Date();
  const t = (i) =>; { return (i < 10 ? '0' : '') + i };

  const year = d.getFullYear();
  const month = d.getMonth() + 1;
  const day = d.getDate();
  const hour = d.getHours();
  const minutes = d.getMinutes();
  const seconds = d.getSeconds();
  const weekday = d.getDay();

  return format.replace(/(yy){1,2}|m{1,2}|d{1,2}|h{1,2}|i{1,2}|s{1,2}|w{1,2}/gi, function(r) {
    switch (r.toUpperCase()) {
      case 'YY':
        return ('' + year).substr(2);
      case 'YYYY':
        return year;
      case 'M':
        return month;
      case 'MM':
        return t(month);
      case 'D':
        return day;
      case 'DD':
        return t(day);
      case 'H':
        return hour;
      case 'HH':
        return t(hour);
      case 'I':
        return minutes;
      case 'II':
        return t(minutes);
      case 'S':
        return seconds;
      case 'SS':
        return t(seconds);
      case 'W':
        return `星期${['日', '一', '二', '三', '四', '五', '六'][weekday]}`;
      case 'WW':
        return ['Sunday', 'Monday', 'TuesDay', 'Wednesday', 'Thursday', 'Friday', 'Saturday'][weekday];
    }
  });
}

函数中 y代表的是年份 m代表的是月份 d 带边的是天 h代表的是小时 m代表的是分 s代表的是秒 w代表的是周不同的个数控制显示的格式，比如5是都要显示成05。

format(1554889542170); // 2019-04-10
format(1554889542170, 'yyyy/mm/dd hh:ii:ss'); // 2019/04/10 17:45:42
format(1554889542170, 'yy/m/d hh:ii:ss'); // 19/4/10 17:45:42
format(1554889542170, 'yyyy/mm/dd w'); // 2019/04/10 星期三
format(1554889542170, 'mm/dd/yyyy'); // 04/10/2019