`

JS日期格式化

 
阅读更多

最近开发的软件中需要用到日志功能,其中有一个重要功能是显示日期和时间。于是网上搜了一把,搜到大量的日期格式化函数,不过比较了下,感觉代码都不够优雅,而且性能都不给力。

对线上一些代码进行了评测,结果如下:

测试代码如下,分别对格式化函数进行50万次计算:

 

var start = new Date().getTime();
var date = new Date();
for(var i = 0;i<500000;i++){
    date.format1('yyyy-MM-dd hh:mm:ss');
}
console.log(new Date().getTime() - start);

 

 

函数1:

// 对Date的扩展,将 Date 转化为指定格式的String
// 月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符, 
// 年(y)可以用 1-4 个占位符,毫秒(S)只能用 1 个占位符(是 1-3 位的数字) 
// 例子: 
// (new Date()).Format("yyyy-MM-dd hh:mm:ss.S") ==> 2014-12-01 08:09:04.423 
// (new Date()).Format("yyyy-M-d h:m:s.S")      ==> 2014-12-01 8:9:4.18 
Date.prototype.format1 = function (fmt) { 
    var o = {
        "M+": this.getMonth() + 1, //月份 
        "d+": this.getDate(), //日 
        "h+": this.getHours(), //小时 
        "m+": this.getMinutes(), //分 
        "s+": this.getSeconds(), //秒 
        "q+": Math.floor((this.getMonth() + 3) / 3), //季度 
        "S": this.getMilliseconds() //毫秒 
    };
    if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
    for (var k in o)
    if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
    return fmt;
}

 

测试三次:

  1. 成绩1:6657毫秒
  2. 成绩2:6739毫秒
  3. 成绩3:6747毫秒
  4. 平均:6714毫秒

函数2:

/** * 对Date的扩展,将 Date 转化为指定格式的String * 月(M)、日(d)、12小时(h)、24小时(H)、分(m)、秒(s)、周(E)、季度(q)
    可以用 1-2 个占位符 * 年(y)可以用 1-4 个占位符,毫秒(S)只能用 1 个占位符(是 1-3 位的数字) * eg: * (new
    Date()).pattern("yyyy-MM-dd hh:mm:ss.S")==> 2014-12-01 08:09:04.423      
 * (new Date()).pattern("yyyy-MM-dd E HH:mm:ss") ==>  2014-12-01 一 20:09:04      
 * (new Date()).pattern("yyyy-MM-dd EE hh:mm:ss") ==>  2014-12-01  周 08:09:04      
 * (new Date()).pattern("yyyy-MM-dd EEE hh:mm:ss") ==>  2014-12-01 10 星期 08:09:04      
 * (new Date()).pattern("yyyy-M-d h:m:s.S") ==>  2014-12-01  8:9:4.18      
 */  
Date.prototype.format2=function(fmt) {         
    var o = {         
    "M+" : this.getMonth()+1, //月份         
    "d+" : this.getDate(), //日         
    "h+" : this.getHours()%12 == 0 ? 12 : this.getHours()%12, //小时         
    "H+" : this.getHours(), //小时         
    "m+" : this.getMinutes(), //分         
    "s+" : this.getSeconds(), //秒         
    "q+" : Math.floor((this.getMonth()+3)/3), //季度         
    "S" : this.getMilliseconds() //毫秒         
    };         
    var week = {         
    "0" : "/u65e5",         
    "1" : "/u4e00",         
    "2" : "/u4e8c",         
    "3" : "/u4e09",         
    "4" : "/u56db",         
    "5" : "/u4e94",         
    "6" : "/u516d"        
    };         
    if(/(y+)/.test(fmt)){         
        fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));         
    }         
    if(/(E+)/.test(fmt)){         
        fmt=fmt.replace(RegExp.$1, ((RegExp.$1.length>1) ? (RegExp.$1.length>2 ? "/u661f/u671f" : "/u5468") : "")+week[this.getDay()+""]);         
    }         
    for(var k in o){         
        if(new RegExp("("+ k +")").test(fmt)){         
            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));         
        }         
    }         
    return fmt;         
} 

 

测试三次:

  1. 成绩1:7334毫秒
  2. 成绩2:7497毫秒
  3. 成绩3:7498毫秒
  4. 平均:7443毫秒

本着完美主义的态度,自己重新造了个更好的轮子,分享给需要的同学们,代码如下:

/** 
 * 对日期进行格式化, 
 * @param date 要格式化的日期 
 * @param format 进行格式化的模式字符串
 *     支持的模式字母有: 
 *     y:年, 
 *     M:年中的月份(1-12), 
 *     d:月份中的天(1-31), 
 *     h:小时(0-23), 
 *     m:分(0-59), 
 *     s:秒(0-59), 
 *     S:毫秒(0-999),
 *     q:季度(1-4)
 * @return String
 */
function dateFormat(date, format) {
    if(format === undefined){
        format = date;
        date = new Date();
    }
    var map = {
        "M": date.getMonth() + 1, //月份 
        "d": date.getDate(), //日 
        "h": date.getHours(), //小时 
        "m": date.getMinutes(), //分 
        "s": date.getSeconds(), //秒 
        "q": Math.floor((date.getMonth() + 3) / 3), //季度 
        "S": date.getMilliseconds() //毫秒 
    };
    format = format.replace(/([yMdhmsqS])+/g, function(all, t){
        var v = map[t];
        if(v !== undefined){
            if(all.length > 1){
                v = '0' + v;
                v = v.substr(v.length-2);
            }
            return v;
        }
        else if(t === 'y'){
            return (date.getFullYear() + '').substr(4 - all.length);
        }
        return all;
    });
    return format;
}

 

使用方法:

  1. dateFormat('yyyy-MM-dd hh:mm:ss');
  2. dateFormat(new Date(), 'yyyy-MM-dd hh:mm:ss');

测试三次:

  1. 成绩1:2903毫秒
  2. 成绩2:2900毫秒
  3. 成绩3:2896毫秒
  4. 平均:2899毫秒

经过改造的函数,整体上性能提升明显,从6714毫秒提升到2899毫秒,减少了3815毫秒,整体降到原43%的时间,性能提升一倍以上。并且从原形注入方式改为静态函数方式,更优雅大方。

分享到:
评论

相关推荐

    javascript日期格式化

    总的来说,JavaScript的日期格式化涉及到`Date`对象的使用、自定义函数的编写以及可能的第三方库的引入。理解这些基本概念,结合实际需求,可以帮助你更好地处理和展示日期数据。在进行日期操作时,应始终考虑跨时区...

    js日期时间格式化日期时间格式化

    js日期时间格式化js日期时间格式化js日期时间格式化js日期时间格式化js日期时间格式化js日期时间格式化js日期时间格式化js日期时间格式化

    javascript中Date format(js日期格式化)方法小结.docx

    ### JavaScript中的Date Format(JS日期格式化)方法详解 #### 概述 在日常的Web开发工作中,我们经常需要处理日期和时间相关的数据。JavaScript 的 `Date` 对象提供了多种方法来获取和设置日期时间,但原生 API 并...

    JS 日期格式化

    JS 日期格式化和加减,适用于将日期格式转化为yyyy-MM-DD HH:mm:ss格式,以及日期的加减

    js通用日期格式化工具 date.js

    js通用日期格式化工具,直接引用该工具类就可以使用,方便快捷,建议大家收藏此工具类,该工具很好的解决了前端页面显示日期格式问题

    js日期格式化

    js日期格式化,对Date的扩展,将 Date 转化为指定格式的String。月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符, 年(y)可以用 1-4 个占位符,毫秒(S)只能用 1 个占位符(是 1-3 位的数字)

    JQuery 日期格式化插件,日期格式化,JS日期格式化

    JQuery 的一个日期格式化插件,支持"MM-dd HH:mm"等格式的设定;并支持日期时间转义,即距当前过去了多久,如"3分钟前","1天前","2周前".

    js 日期格式 脚本下载 例子

    总的来说,这个压缩包提供了一个简单的JavaScript日期格式化的实例,可以帮助开发者理解如何在没有外部库的情况下手动进行日期格式化。对于初学者来说,这是一个很好的实践项目,可以深入理解JavaScript日期处理的...

    js 日期 format 格式化

    ### JavaScript 日期格式化方法详解 在Web开发中,日期时间的处理是非常常见的需求之一,尤其是在前端页面上显示用户友好的日期格式时。本文将详细介绍一种JavaScript中的自定义日期格式化方法,它允许开发者轻松地...

    javascript日期格式化方法汇总

    ### JavaScript日期格式化基础 JavaScript中的日期对象`Date`提供了多种属性和方法来获取日期和时间的详细信息,比如年、月、日、小时、分钟、秒和毫秒等。格式化日期时间就是将这些信息按照一定的格式转换成字符串...

    兼容ios的日期格式化

    兼容ios的日期格式化,兼容ios的日期格式化,兼容ios的日期格式化

    Js获取当前日期时间及格式化代码

    描述中的知识点:介绍了如何使用JavaScript(Js)获取当前的日期和时间,并提供了一个格式化日期时间的代码示例。 标签中的知识点:涉及到Js在获取日期时间方面相关的几个关键功能和方法,包括获取年份、月份、日、...

    javascript 日期数字文本格式化

    在实际应用中,JavaScript的日期格式化可以使用多种方式实现,包括但不限于自定义函数、使用内置`Date`对象的`toLocaleString`或`toISOString`方法,或者利用第三方库,如Moment.js或date-fns。这些库提供了丰富的...

    bootstap-talbe日期格式化

    这里,我们使用了 Moment.js 库来进行日期格式化。你需要在页面中引入 Moment.js 并确保其在 Bootstrap Table 的 JavaScript 之前加载。 最后,后端 API 需要提供 JSON 格式的日期数据。在 Spring MVC 控制器中,你...

    格式化数据库日期JS

    结合以上两个函数,我们可以创建一个完整的日期格式化函数`functionDateTimeFormat(jsondate)`,该函数接受一个JSON日期字符串作为输入,返回格式化的日期字符串。 ```javascript function functionDateTimeFormat...

    js 格式化日期 JavaScript格式化日期类型

    js 语言的格式化日期格式的类。很好用的。

    javascript日期格式化方法小结

    JavaScript中的日期格式化是一个常见的需求,开发者通常需要将日期和时间按照一定的格式输出显示,例如在网页上显示用户的注册日期或者文章的发布日期。在本文中,我们将探讨JavaScript中的日期格式化方法,包括使用...

    javascript的trim和日期时间格式化函数

    下面是一个自定义的日期格式化函数示例: ```javascript Date.prototype.format = function (format) { var o = { "M+": this.getMonth() + 1, // month "d+": this.getDate(), // day "h+": this.getHours(), ...

Global site tag (gtag.js) - Google Analytics