javascript日期处理函数,性能优化批处理


Posted in Javascript onSeptember 06, 2015

其实网上写javascript日期格式化的博文很多,大体都看了看,都还不错。唯一遗憾的是只顾着实现了功能,没对函数进行性能优化。
俗话说:不要重复造轮子。google上找了一个比较不错的日期格式化函数,来开始我的优化之旅吧!
google上找的这个日期函数化函数,估计大家都很眼熟,以前我也一直在用。先看看优化后和优化前的效率对比吧!
1、优化之前的toDate函数(字符串转换成Date对象),重复执行1万次,耗时660毫秒

javascript日期处理函数,性能优化批处理

2、优化之前的dateFormat函数(Date对象格式化成字符串),重复执行1万次,耗时676毫秒

javascript日期处理函数,性能优化批处理

3、优化过后的toDate函数,重复执行1万次,耗时122毫秒

javascript日期处理函数,性能优化批处理

4、优化后的dateFormat函数,重复执行1万次,耗时160毫秒

javascript日期处理函数,性能优化批处理

为什么前后差别这么大,其实我也没做多少处理,只是为批处理做了一些缓存而已,认真观察所有网上那些日期格式函数,其实都是用正则进行匹配和替换。其实正则是很耗性能的,于是我在正则匹配的地方做了缓存,把匹配值建立索引。以后就不用每次都去做正则匹配了。

无代码无真相,接下来看看真相吧!

(function(window) {
  var sinojh = {
    Version : "1.2",
    Copyright : "Copyright© sino-jh 2012",
    Author : "Jeff Lan",
    Email : "jefflan@live.cn"
  };
  /**
   * 方便于添加和重写类的属性
   * @param {Object} attributes 添加的属性
   */
  Function.prototype.prototypes = function(attributes) {
    for ( var a in attributes) {
      this.prototype[a] = attributes[a];
    }
  };
  /**
   * 获取Url参数
   * @param {String} parameter 参数名
   * @return {String} 参数值
   */
  sinojh.getUrlParameter = function(parameter) {
    if (!sinojh.getUrlParameter.cache) {
      var url = window.location.href;
      var paraString = url.substring(url.indexOf("?") + 1, url.length).split("&");
      var cache = {};
      for ( var i in paraString) {
        var j = paraString[i];
        cache[j.substring(0, j.indexOf("="))] = j.substring(j.indexOf("=") + 1, j.length);
      }
      sinojh.getUrlParameter.cache = cache;
    }
    return sinojh.getUrlParameter.cache[parameter];
  };
  /**
   * 日期格式化
   * @param {Date} date 日期对象
   * @param {String} formatStyle 格式化样式
   * @return {String} 日期型字符串
   */
  sinojh.dateFormat = function(date, formatStyle) {
    formatStyle = formatStyle ? formatStyle : sinojh.dateFormat.settings.formatStyle;
    var time = {
      "M+" : date.getMonth() + 1,
      "d+" : date.getDate(),
      "h+" : date.getHours(),
      "m+" : date.getMinutes(),
      "s+" : date.getSeconds(),
      "S" : date.getMilliseconds()
    };
    if (formatStyle == sinojh.dateFormat.formatStyleCache) {
      var replaceCache = sinojh.dateFormat.replaceCache;
      if (replaceCache["y+"]) {
        formatStyle = formatStyle.replace(replaceCache["y+"].replace, (date.getFullYear() + "").substring(replaceCache["y+"].index));
      }
      for ( var k in time) {
        if (replaceCache[k]) {
          formatStyle = formatStyle.replace(replaceCache[k].replace, replaceCache[k].replace.length == 1 ? time[k] : ("00" + time[k]).substring(("" + time[k]).length));
        }
      }
    } else {
      sinojh.dateFormat.formatStyleCache = formatStyle;
      var replaceCache = {};
      if (new RegExp("(y+)").test(formatStyle)) {
        var index = 4 - RegExp.$1.length;
        replaceCache["y+"] = {
          replace : RegExp.$1,
          index : index
        };
        formatStyle = formatStyle.replace(RegExp.$1, (date.getFullYear() + "").substring(index));
      }
      for ( var k in time) {
        if (new RegExp("(" + k + ")").test(formatStyle)) {
          replaceCache[k] = {
            replace : RegExp.$1
          };
          formatStyle = formatStyle.replace(RegExp.$1, RegExp.$1.length == 1 ? time[k] : ("00" + time[k]).substring(("" + time[k]).length));
        }
      }
      sinojh.dateFormat.replaceCache = replaceCache;
    }
    return formatStyle;
  };
  sinojh.dateFormat.settings = {
    formatStyle : "yyyy-MM-dd hh:mm:ss"
  };
  /**
   * 将日期格式的字符串转换成Date对象
   * @param {String} dateStr 日期格式字符串
   * @param {String} dateStyle 日期格式
   * @return {Date} 日期对象
   */
  sinojh.toDate = function(dateStr, dateStyle) {
    dateStyle = dateStyle ? dateStyle : sinojh.toDate.settings.dateStyle;
    var compare = sinojh.toDate.compare;
    var result = new sinojh.toDate.result();
    if (dateStyle == sinojh.toDate.settings.dateStyleCache) {
      var indexCache = sinojh.toDate.indexCache;
      for ( var k in compare) {
        if (indexCache[k]) {
          result[compare[k]] = dateStr.substring(indexCache[k].index, indexCache[k].index + indexCache[k].length);
        }
      }
    } else {
      var indexCache = {};
      for ( var k in compare) {
        if (new RegExp("(" + k + ")").test(dateStyle)) {
          var index = dateStyle.indexOf(RegExp.$1);
          var length = RegExp.$1.length;
          indexCache[k] = {
            index : index,
            length : length
          };
          result[compare[k]] = dateStr.substring(index, index + length);
        }
      }
      sinojh.toDate.indexCache = indexCache;
      sinojh.toDate.settings.dateStyleCache = dateStyle;
    }
    return new Date(result["y"], result["M"] - 1, result["d"], result["h"], result["m"], result["s"], result["S"]);
  };
  sinojh.toDate.compare = {
    "y+" : "y",
    "M+" : "M",
    "d+" : "d",
    "h+" : "h",
    "m+" : "m",
    "s+" : "s",
    "S" : "S"
  };
  sinojh.toDate.result = function() {
  };
  sinojh.toDate.result.prototypes( {
    "y" : "",
    "M" : "",
    "d" : "",
    "h" : "00",
    "m" : "00",
    "s" : "00",
    "S" : "000"
  });
  sinojh.toDate.settings = {
    dateStyle : "yyyy-MM-dd hh:mm:ss"
  };
  delete Function.prototype.prototypes;
  window.jh = sinojh;
}(this);
Javascript 相关文章推荐
JS 容错处理代码, 屏蔽错误信息
Mar 09 Javascript
JS window.opener返回父页面的应用
Oct 24 Javascript
Javascript 加载和执行-性能提高篇
Dec 28 Javascript
用jquery等比例控制图片宽高的具体实现
Jan 28 Javascript
提升PHP安全:8个必须修改的PHP默认配置
Nov 17 Javascript
IE8中动态创建script标签onload无效的解决方法
Dec 22 Javascript
jQuery 选择器详解
Jan 19 Javascript
JS实现简单的键盘打字的效果
Apr 24 Javascript
ionic2打包android时gradle无法下载的解决方法
Apr 05 Javascript
纯js实现图片匀速淡入淡出效果
Aug 22 Javascript
jQuery实现基本动画效果的方法详解
Sep 06 jQuery
如何在vue中使用HTML 5 拖放API
Jan 14 Vue.js
js实现改进的仿蓝色论坛导航菜单效果代码
Sep 06 #Javascript
配置Grunt的Task时通配符支持和动态生成文件名问题
Sep 06 #Javascript
基于jquery实现的树形菜单效果代码
Sep 06 #Javascript
jQuery.extend 函数及用法详细
Sep 06 #Javascript
jquery动态导航插件dynamicNav用法实例分析
Sep 06 #Javascript
jquery实现可自动收缩的TAB网页选项卡代码
Sep 06 #Javascript
jquery实现初次打开有动画效果的网页TAB切换代码
Sep 06 #Javascript
You might like
PHP程序员面试 切忌急功近利(更需要注重以后的发展)
2010/09/01 PHP
PHP中函数rand和mt_rand的区别比较
2012/12/26 PHP
win7计划任务定时执行PHP脚本设置图解
2014/05/09 PHP
thinkphp关于简单的权限判定方法
2017/04/03 PHP
PHP中的输出echo、print、printf、sprintf、print_r和var_dump的示例代码
2020/12/01 PHP
屏蔽鼠标右键、Ctrl+n、shift+F10、F5刷新、退格键 的javascript代码
2007/04/01 Javascript
js实现正方形颜色从下往上升的效果
2014/08/04 Javascript
js设置document.domain实现跨域的注意点分析
2015/05/21 Javascript
跟我学习javascript的作用域与作用域链
2015/11/19 Javascript
微信小程序 在Chrome浏览器上运行以及WebStorm的使用
2016/09/27 Javascript
微信小程序 教程之条件渲染
2016/10/18 Javascript
js使用原型对象(prototype)需要注意的地方
2017/08/28 Javascript
详解微信小程序中的页面代码中的模板的封装
2017/10/12 Javascript
vue.js  父向子组件传参的实例代码
2017/10/29 Javascript
js+html获取系统当前时间
2017/11/10 Javascript
vue 解决data中定义图片相对路径页面不显示的问题
2020/08/13 Javascript
vuex刷新后数据丢失的解决方法
2020/10/18 Javascript
[01:13]DOTA2群星解读国服召集令 一起说出回归的理由
2013/07/17 DOTA
利用Python的Django框架生成PDF文件的教程
2015/07/22 Python
Python中列表与元组的乘法操作示例
2018/02/10 Python
浅谈Tensorflow由于版本问题出现的几种错误及解决方法
2018/06/13 Python
Python中浅拷贝copy与深拷贝deepcopy的简单理解
2018/10/26 Python
浅谈python str.format与制表符\t关于中文对齐的细节问题
2019/01/14 Python
python tkinter实现彩球碰撞屏保
2019/07/30 Python
python中的Elasticsearch操作汇总
2019/10/30 Python
详解基于Facecognition+Opencv快速搭建人脸识别及跟踪应用
2021/01/21 Python
在阿尔卑斯山或希腊度过快乐假期:Alpine Elements
2019/12/28 全球购物
介绍一下javax.servlet.Servlet接口及其主要方法
2015/11/30 面试题
信息系统专业个人求职信范文
2013/12/07 职场文书
学前班评语大全
2014/05/04 职场文书
政府信息公开实施方案
2014/05/09 职场文书
幼儿园母亲节活动总结
2015/02/10 职场文书
工程部主管岗位职责
2015/02/12 职场文书
创业计划书之服装
2019/10/07 职场文书
pytorch 如何使用batch训练lstm网络
2021/05/28 Python
MySQL修炼之联结与集合浅析
2021/10/05 MySQL