在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实现状态限定编辑的代码
Feb 11 Javascript
jQuery实现表格颜色交替显示的方法
Mar 09 Javascript
改变checkbox默认选中状态及取值的实现代码
May 26 Javascript
JS判断form内所有表单是否为空的简单实例
Sep 09 Javascript
微信小程序 前端源码逻辑和工作流详解
Oct 08 Javascript
JS+HTML5 FileReader实现文件上传前本地预览功能
Mar 27 Javascript
vue router学习之动态路由和嵌套路由详解
Sep 21 Javascript
vue bus全局事件中心简单Demo详解
Feb 26 Javascript
老生常谈JavaScript获取CSS样式的方法(兼容各浏览器)
Sep 19 Javascript
React父子组件间的传值的方法
Nov 13 Javascript
react写一个select组件的实现代码
Apr 03 Javascript
浅谈vue限制文本框输入数字的正确姿势
Sep 02 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
php模拟ping命令(php exec函数的使用方法)
2013/10/25 PHP
javascript脚本编程解决考试分数统计问题
2008/10/18 Javascript
javascript实现复制与粘贴操作实例
2014/10/16 Javascript
jquery动态导航插件dynamicNav用法实例分析
2015/09/06 Javascript
jQuery+css实现的tab切换标签(兼容各浏览器)
2016/01/28 Javascript
jquery.cookie.js实现用户登录保存密码功能的方法
2016/04/15 Javascript
JS针对浏览器窗口关闭事件的监听方法集锦
2016/06/24 Javascript
JavaScript判断数组是否存在key的简单实例
2016/08/03 Javascript
零基础轻松学JavaScript闭包
2016/12/30 Javascript
Bootstrap页面缩小变形的快速解决办法
2017/02/03 Javascript
让div运动起来 js实现缓动效果
2017/07/06 Javascript
详解Vue2.x-directive的学习笔记
2017/07/17 Javascript
JS实现调用本地摄像头功能示例
2018/05/18 Javascript
原生js实现的移动端可拖动进度条插件功能详解
2019/08/15 Javascript
nodejs使用node-xlsx生成excel的方法示例
2019/08/22 NodeJs
JS实现的定时器展示简单秒表、页面弹框及跳转操作完整示例
2020/01/26 Javascript
[34:39]DOTA2上海特级锦标赛主赛事日 - 4 败者组第四轮#1COL VS EG第二局
2016/03/05 DOTA
[47:45]DOTA2-DPC中国联赛 正赛 Phoenix vs Dragon BO3 第一场 2月26日
2021/03/11 DOTA
python开发中range()函数用法实例分析
2015/11/12 Python
Python利用Beautiful Soup模块搜索内容详解
2017/03/29 Python
Django框架实现的分页demo示例
2019/05/25 Python
Python 实现顺序高斯消元法示例
2019/12/09 Python
一款利用html5和css3实现的3D立方体旋转效果教程
2016/04/26 HTML / CSS
探讨HTML5移动开发的几大特性(必看)
2015/12/30 HTML / CSS
耐克美国官网:Nike.com
2016/08/01 全球购物
澳大利亚正品化妆品之家:Cosmetic Capital
2017/07/03 全球购物
西班牙最好的在线购买葡萄酒的商店:Vinoseleccion
2019/10/30 全球购物
大二法英学生职业生涯规划范文
2014/02/27 职场文书
公司合并协议书范本
2014/09/30 职场文书
卖车协议书范本4篇
2014/10/01 职场文书
2015年勤工助学工作总结
2015/04/29 职场文书
大学升旗仪式主持词
2015/07/04 职场文书
旅行社计调工作总结
2015/08/12 职场文书
JavaScript实现酷炫的鼠标拖尾特效
2022/02/18 Javascript
详解SQL的窗口函数
2022/04/21 Oracle
ubuntu如何搭建vsftpd服务器
2022/12/24 Servers