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 相关文章推荐
中国地区三级联动下拉菜单效果分析
Nov 15 Javascript
用jquery方法操作radio使其默认选项是否
Sep 10 Javascript
如何使用HTML5地理位置定位功能
Apr 27 Javascript
AngularJS入门教程之与服务器(Ajax)交互操作示例【附完整demo源码下载】
Nov 02 Javascript
JS弹性运动实现方法分析
Dec 15 Javascript
js仿京东轮播效果 选项卡套选项卡使用
Jan 12 Javascript
Angular.Js之Scope作用域的学习教程
Apr 27 Javascript
BootstrapTable加载按钮功能实例代码详解
Sep 22 Javascript
echarts实现地图定时切换散点与多图表级联联动详解
Aug 07 Javascript
VUE v-for循环中每个item节点动态绑定不同函数的实例
Sep 26 Javascript
JS面向对象实现飞机大战
Aug 26 Javascript
javascript实现智能手环时间显示
Sep 18 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
Ajax+PHP边学边练 之五 图片处理
2009/12/03 PHP
PHP得到某段时间区间的时间戳 php定时任务
2012/04/12 PHP
解析php中var_dump,var_export,print_r三个函数的区别
2013/06/21 PHP
使用PHP破解防盗链图片的一个简单方法
2014/06/07 PHP
WordPress开发中的get_post_custom()函数使用解析
2016/01/04 PHP
YII中Ueditor富文本编辑器文件和图片上传的配置图文教程
2017/03/15 PHP
jQuery 1.0.4 - New Wave Javascript(js源文件)
2007/01/15 Javascript
jquery实现非叠加式的搜索框提示效果
2014/01/07 Javascript
Js实现无刷新删除内容
2015/04/29 Javascript
jQuery页面加载初始化的3种方法(推荐)
2016/06/02 Javascript
JQuery对ASP.NET MVC数据进行更新删除
2016/07/13 Javascript
js 获取本地文件及目录的方法(推荐)
2016/11/10 Javascript
html+javascript+bootstrap实现层级多选框全层全选和多选功能
2017/03/09 Javascript
深入理解Node.js中通用基础设计模式
2017/09/19 Javascript
使用jQuery实现两个div中按钮互换位置的实例代码
2017/09/21 jQuery
代码详解JS操作剪贴板
2018/02/11 Javascript
原生JS封装_new函数实现new关键字的功能
2018/08/12 Javascript
vue实现五子棋游戏
2020/05/28 Javascript
Jquery 获取相同NAME 或者id删除行操作
2020/08/24 jQuery
pymongo实现多结果进行多列排序的方法
2015/05/16 Python
python 读写中文json的实例详解
2017/10/29 Python
selenium+python 去除启动的黑色cmd窗口方法
2018/05/22 Python
10分钟教你用python动画演示深度优先算法搜寻逃出迷宫的路径
2019/08/12 Python
如何基于python实现画不同品种的樱花树
2020/01/03 Python
Python自动化办公Excel模块openpyxl原理及用法解析
2020/11/05 Python
HTML5本地存储之Web Storage详解
2016/07/04 HTML / CSS
HTML5语义化元素你真的用对了吗
2019/08/22 HTML / CSS
adidas美国官网:adidas US
2016/09/21 全球购物
法学专业毕业生自荐信范文
2013/12/18 职场文书
光荣入党自我鉴定
2014/01/22 职场文书
建筑安全生产目标责任书
2014/07/23 职场文书
五好家庭事迹材料
2014/12/20 职场文书
大学生违纪检讨书范文
2015/05/07 职场文书
《七月的天山》教学反思
2016/02/19 职场文书
中学教代会开幕词
2016/03/04 职场文书
使用Oracle跟踪文件的问题详解
2021/06/28 Oracle