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 相关文章推荐
JavaScript CSS 修改学习第四章 透明度设置
Feb 19 Javascript
jQuery .tmpl(), .template()学习资料小结
Jul 18 Javascript
css样式标签和js语法属性区别
Nov 06 Javascript
JavaScript保留两位小数的2个自定义函数
May 05 Javascript
JavaScript对象之深度克隆介绍
Dec 08 Javascript
node.js中的console.trace方法使用说明
Dec 09 Javascript
Easyui form combobox省市区三级联动
Jan 13 Javascript
AngularJS中的表单简单入门
Jul 28 Javascript
jQuery+CSS3实现四种应用广泛的导航条制作实例详解
Sep 17 Javascript
JS实现简单的天数计算器完整实例
Apr 28 Javascript
微信小程序地图(map)组件点击(tap)获取经纬度的方法
Jan 10 Javascript
layui type2 通过url给iframe子页面传值的例子
Sep 06 Javascript
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
ADODB结合SMARTY使用~超级强
2006/11/25 PHP
php smarty模版引擎中变量操作符及使用方法
2009/12/11 PHP
PHP判断远程图片或文件是否存在的实现代码
2014/02/20 PHP
PHP中使用imagick生成PSD文件缩略图教程
2015/01/26 PHP
如何使用PHP给图片加水印
2016/10/12 PHP
laravel框架select2多选插件初始化默认选中项操作示例
2020/02/18 PHP
利用谷歌地图API获取点与点的距离的js代码
2012/10/11 Javascript
javascript和jquery实现设置和移除文本框默认值效果代码
2015/01/13 Javascript
js数组去重的方法汇总
2015/07/29 Javascript
jquery获取img的src值的简单实例
2016/05/17 Javascript
canvas实现流星雨的背景效果
2017/01/13 Javascript
Angularjs中使用指令绑定点击事件的方法
2017/03/30 Javascript
JS生成随机打乱数组的方法示例
2017/12/23 Javascript
通过实例解析js简易模块加载器
2019/06/17 Javascript
解决layui调用自定义方法提示未定义的问题
2019/09/14 Javascript
js实现搜索提示框效果
2020/09/05 Javascript
jquery插件懒加载的示例
2020/10/24 jQuery
JS addEventListener()和attachEvent()方法实现注册事件
2021/01/11 Javascript
Python中使用tarfile压缩、解压tar归档文件示例
2015/04/05 Python
Python语言实现获取主机名根据端口杀死进程
2016/03/31 Python
python生成excel的实例代码
2017/11/08 Python
利用Opencv中Houghline方法实现直线检测
2018/02/11 Python
在OpenCV里实现条码区域识别的方法示例
2019/12/04 Python
python MultipartEncoder传输zip文件实例
2020/04/07 Python
CSS3中利用animation属性创建雪花飘落特效
2014/05/14 HTML / CSS
CSS3色彩模式有哪些?CSS3 HSL色彩模式的定义
2016/04/26 HTML / CSS
网络方面基础面试题
2012/11/16 面试题
Linux上比较文件的命令都有哪些
2013/09/28 面试题
写自荐信有哪些不宜?
2013/10/17 职场文书
党员自我剖析材料范文
2014/10/06 职场文书
2014年部门工作总结
2014/11/12 职场文书
房地产工程部经理岗位职责
2015/04/09 职场文书
python的变量和简单数字类型详解
2021/09/15 Python
解决Mysql多行子查询的使用及空值问题
2022/01/22 MySQL
MySQL为数据表建立索引的原则详解
2022/03/03 MySQL
解决 redis 无法远程连接
2022/05/15 Redis