在js中做数字字符串补0

通常遇到的一个问题是日期的“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

月影在这里分析了其中的技巧,以及代码长短与效率上的平衡:

http://hi.baidu.com/akira_cn/blog/item/90ba2a8b07c867dafc1f1045.html

 

最后月影推荐的是“质朴长存法”:

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


这个在“没事就射鸟”同学的博客里做了分析:

http://lifesinger.org/blog/2009/08/the-harm-of-tricky-code/

 

月影同学有一件事是没有做的,就是没说明“为什么那个短代码的效率更低?”。

答案是“表面看来,用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 中,给字符串数字前面 0 可以采用以下几种方法: ### 字符串拼接 + slice 方法 ```javascript /** * @param {number | string} num 数值 * @param {number} length 需要换成的长度 */ function formatNum(num, length) { let str0 = ''; for (let i = 0; i < length; i++) { str0 += '0'; } return (str0 + num).slice(-length); } console.log(formatNum(23, 5)); // 输出: 00023 console.log(formatNum('023', 5)); // 输出: 00023 ``` 该方法的实现思路是先创建一个由所需数量的 0 组成的字符串,然后将其与输入的数字拼接,最后截取拼接后字符串的后 `length` 位 [^1]。 ### 使用 `padStart()` 方法 ```javascript console.log(String(23).padStart(5, '0')); // 方式 1,输出: 00023 console.log((23 + '').padStart(5, '0')); // 方式 2,输出: 00023 ``` `padStart()` 是 JavaScript 字符串的内置方法,它可以在字符串的开头填充指定的字符,直到字符串达到指定的长度 [^1]。 ### 自定义函数实现 ```javascript /** * 字符串0(或其他字符) * @author wuyujin <wuyujin1997@outlook.com> * @param {String} str 需要处理的字符串 * @param {Number} length 结果的长度(默认和传入的字符串长度相同) * @param {String} ch 要填充的字符(默认为0) * @return {String} 处理过的字符串 */ String.addPrefixForString = function(str, length, ch) { // 若length不指定,或与str长度相同,则不全直接返回。 if (length == undefined || length === str.length) { return str; } // 默认用0齐 if (ch == undefined) { ch = "0"; } let diffCnt = length - str.length; let result = ""; for (let i = 0; i < diffCnt; i++) { result += ch; } return result + str; } console.log(String.addPrefixForString('23', 5)); // 输出: 00023 ``` 自定义函数 `addPrefixForString` 可以在字符串的开头填充指定的字符,若未指定填充字符则默认填充 0 [^3]。
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值