JavaScript使用padStart()方法进行字符串填充的实战指南

// 手动实现左填充函数
function leftPad(str, length, padChar = ' ') {
  const padCount = length - str.length;
  return padCount > 0 
    ? padChar.repeat(padCount) + str 
    : str;
}

console.log(leftPad('42', 5, '0')); // "00042"

/**
 * 字符串起始位置填充
 * @param {number} targetLength - 填充后目标长度
 * @param {string} [padString=' '] - 填充字符(默认空格)
 * @returns {string} 填充后的新字符串
 */
String.prototype.padStart(targetLength, padString);

'7'.padStart(3, 'abcdef'); // "ab7" 

const price = 9.9;
price.toString().padStart(5, '0'); // "09.9"

String(null).padStart(2, '0'); // "null"

// 金额分转元并补零
function formatCurrency(cents) {
  const yuan = (cents / 100).toFixed(2);
  return yuan.padStart(8, ' '); // 对齐到8位
}

console.log(formatCurrency(12345)); // "  123.45"

// 10进制转8位二进制
function toBinary(num) {
  return num.toString(2).padStart(8, '0');
}

console.log(toBinary(42)); // "00101010"

const logLevels = ['DEBUG', 'INFO', 'WARN'];
const messages = ['Starting app', 'User logged in', 'Memory low'];

// 生成对齐的日志输出
logLevels.forEach((level, i) => {
  console.log(
    `[${level.padStart(5)}] ${messages[i].padEnd(20)}`
  );
});
/*
[DEBUG] Starting app        
[ INFO] User logged in      
[ WARN] Memory low          
*/

pie
    title 各方法CPU耗时占比
    "手动循环填充" : 42
    "Array.join填充" : 29
    "padStart" : 29

// 生成银行账号格式：****-****-1234
const lastFour = '1234';
const masked = lastFour
  .padStart(12, '*')      // "********1234"
  .replace(/(.{4})/g, '$1-') // 每4位加分隔符
  .slice(0, -1);          // 移除末尾多余分隔符

console.log(masked); // "****-****-1234"

// 创建文本装饰线
const title = " CHAPTER 1 ";
console.log(
  title.padStart(30, '═').padEnd(40, '═')
);
// "══════════ CHAPTER 1 ══════════"

'overflow'.padStart(3); // "overflow" 

'1'.padStart(3, true); // "tr1" 

'A'.padStart(5, 'XYZ'); // "XYXYA" 

// 安全垫片实现
if (!String.prototype.padStart) {
  String.prototype.padStart = function(targetLen, padStr) {
    targetLen = Math.floor(targetLen) || 0;
    if (targetLen <= this.length) return String(this);
    
    padStr = padStr ? String(padStr) : ' ';
    let repeatCnt = Math.ceil((targetLen - this.length) / padStr.length);
    
    return padStr.repeat(repeatCnt).slice(0, targetLen - this.length) 
           + String(this);
  };
}