在js中做数字字符串补0(js补零)


Posted in Javascript onMarch 25, 2017

通常遇到的一个问题是日期的“1976-02-03 HH:mm:ss”这种格式 ,我的比较简单的处理方法是这样:

function formatDate(d) {
 var D=['00','01','02','03','04','05','06','07','08','09']
 with (d || new Date) return [
  [getFullYear(), D[getMonth()+1]||getMonth()+1, D[getDate()]||getDate()].join('-'),
  [D[getHours()]||getHours(), D[getMinutes()]||getMinutes(), D[getSeconds()]||getSeconds()].join(':')
 ].join(' ');
}

这种方法是逻辑比较简单的,而且规则也简单。除了with(d||new Date)的使用之外,也算不上什么技巧。但是,如果用这种方法来做数字字符串补0,那么结果显然不妙。51js的月影提供了另一个方案:

function pad(num, n) {
 return Array(n>num?(n-(''+num).length+1):0).join(0)+num;
}

调用示例如下:

pad(100, 4); // 输出:0100

月影在这里分析了其中的技巧,以及代码长短与效率上的平衡:
最后月影推荐的是“质朴长存法”:

/* 质朴长存法 by lifesinger */
function pad(num, n) {
  var len = num.toString().length;
  while(len < n) {
    num = "0" + num;
    len++;
  }
  return num;
}

这个在“没事就射鸟”同学的博客里做了分析
月影同学有一件事是没有做的,就是没说明“为什么那个短代码的效率更低?”。
答案是“表面看来,用array.join来替代循环是高效的,但忘掉了一个数组创建的开销”。对此有没有法子呢?我有过另一个解决的思路。如下:

/* 查表法(不完善) by aimingoo */
pad = function(tbl) {
 return function(num, n) {
  return (((tbl[n = n-num.toString().length]) || (tbl[n] = Array(n).join(0))) + num);
 }
}([]);

这个路子跟前面的formatDate()是一样的,只不是formatDate()里的表是一个确定的数组,而这里的数组则是动态生成,然后缓存在tbl[]里面。这个缓存的tbl[]数组是使用一个函数调用参数的形式,保持在最终的pad()函数的上层闭包里面。为了让上面的这个过程清晰一点,我重排代码格式如下:

pad = function(tbl) {
 return function(num, n) {
  return (
   ((tbl[n = n-num.toString().length]) ||
    (tbl[n] = Array(n).join(0))) +
   num
  );
 }
}([]);

好的。到这里,先别急,还有两个问题要解决。其一,当不需要补0时,上述的tbl[0]返回空值,所以会进入到“||”运算的第二个分支,因此导致Array()重算一次,也就是说“不补0的情况效率其实最低”。其二,当num长度大于n时,也就变成了“补负数个零”。“补负数个零”显然不行,一般对此处理成“不需要补零”,于是又回到了第一个问题。

这两个问题可以一次解决,其实就是多一次判断:

/* 查表法(完善版本) by aimingoo */
pad = function(tbl) {
 return function(num, n) {
  return (0 >= (n = n-num.toString().length)) ? num : (tbl[n] || (tbl[n] = Array(n+1).join(0))) + num;
 }
}([]);

当然,也可以象前面一样整理一下这个代码格式。或者,采用一个完全不用“(函数式语言的)连续运算等技巧”的版本:

/* 查表法(过程式版本) by aimingoo */
pad = function() {
 var tbl = [];
 return function(num, n) {
  var len = n-num.toString().length;
  if (len <= 0) return num;
  if (!tbl[len]) tbl[len] = (new Array(len+1)).join('0');
  return tbl[len] + num;
 }
}();

算法永远都是如此,要不是时间换空间,要不就是空间换时间。射雕同学的“质朴长存法”是时间换空间的方法,而这里的查表法则是空间换时间的方案。这个函数会在tbl中持续一个字符串数组,如果num是非常经常变化的,那么效率也不会有太大提升——对于过于频繁变化的系统,缓存就意义不大了。其实逻辑都差不多,月影同学只是少走了一步而已。

Javascript 相关文章推荐
jQuery Ajax提交表单查询获得数据实例代码
Sep 19 Javascript
javascript间隔刷新的简单实例
Nov 14 Javascript
BootStrap 智能表单实战系列(十)自动完成组件的支持
Jun 13 Javascript
前端面试题及答案整理(二)
Aug 26 Javascript
详谈JavaScript的闭包及应用
Jan 17 Javascript
JS库之wow.js使用方法
Sep 14 Javascript
Vue.js项目模板搭建图文教程
Sep 20 Javascript
js中document.write和document.writeln的区别
Mar 11 Javascript
浅析Vue.js 中的条件渲染指令
Nov 19 Javascript
jQuery访问json文件中数据的方法示例
Jan 28 jQuery
微信小程序实现单列下拉菜单效果
Apr 25 Javascript
es6函数name属性功能与用法实例分析
Apr 18 Javascript
JavaScript 字符串数字左补位,右补位,取固定长度,截位扩展函数代码
Mar 25 #Javascript
JS去掉字符串前后空格或去掉所有空格的用法
Mar 25 #Javascript
javascript作用域链与执行环境详解
Mar 25 #Javascript
vue中用动态组件实现选项卡切换效果
Mar 25 #Javascript
使用vue.js写一个tab选项卡效果
Mar 25 #Javascript
JavaScript 实现 Tab 点击切换实例代码
Mar 25 #Javascript
JS操作xml对象转换为Json对象示例
Mar 25 #Javascript
You might like
在Windows系统上安装PHP运行环境文字教程
2010/07/19 PHP
PHP禁止个别IP访问网站
2013/10/30 PHP
php自定义加密与解密程序实例
2014/12/31 PHP
Zend Framework实现Zend_View集成Smarty模板系统的方法
2016/03/05 PHP
利用PHP将图片转换成base64编码的实现方法
2016/09/13 PHP
jquery中get和post的简单实例
2014/02/04 Javascript
JavaScript函数定义的常见注意事项小结
2014/09/16 Javascript
JavaScript中用toString()方法返回时间为字符串
2015/06/12 Javascript
浅谈Javascript实现继承的方法
2015/07/06 Javascript
JS函数arguments数组获得实际传参数个数的实现方法
2016/05/28 Javascript
JS判断日期格式是否合法的简单实例
2016/07/11 Javascript
微信小程序 使用canvas制作K线实例详解
2017/01/12 Javascript
有关JS中的0,null,undefined,[],{},'''''''',false之间的关系
2017/02/14 Javascript
简单谈谈关于 npm 5.0 的新坑
2017/06/08 Javascript
微信小程序搜索组件wxSearch实例详解
2017/06/08 Javascript
vue-cli项目优化方法- 缩短首屏加载时间
2018/04/01 Javascript
vue里面使用mui的弹出日期选择插件实例
2018/09/16 Javascript
Layui数据表格跳转到指定页的实现方法
2019/09/05 Javascript
vue开发简单上传图片功能
2020/06/30 Javascript
python实现逻辑回归的方法示例
2017/05/02 Python
Python使用回溯法子集树模板解决迷宫问题示例
2017/09/01 Python
对Python 2.7 pandas 中的read_excel详解
2018/05/04 Python
Python简直是万能的,这5大主要用途你一定要知道!(推荐)
2019/04/03 Python
Python如何使用字符打印照片
2020/01/03 Python
tensorflow estimator 使用hook实现finetune方式
2020/01/21 Python
用python对oracle进行简单性能测试
2020/12/05 Python
PyTorch中clone()、detach()及相关扩展详解
2020/12/09 Python
HTML5 Canvas draw方法制作动画效果示例
2013/07/11 HTML / CSS
苹果台湾官网:Apple台湾
2019/01/05 全球购物
财务工作个人求职的自我评价
2013/12/19 职场文书
运动会通讯稿400字
2014/01/28 职场文书
《小动物过冬》教学反思
2014/04/17 职场文书
小学生操行评语大全
2014/04/22 职场文书
党的群众路线教育实践活动个人批评与自我批评
2014/10/16 职场文书
如何用PHP websocket实现网页实时聊天
2021/05/26 PHP
总结Python连接CS2000的详细步骤
2021/06/23 Python