在 JS开发中,填充字符串是一个常见的操作,用于在字符串的开头或结尾添加特定字符,使其达到所需的长度。本文将介绍几种实现字符串填充的方法,包括内置方法和一些手动实现的方式。
1. 使用 padStart()
String.prototype.padStart() 方法用于在当前字符串的开头填充指定的字符,直到字符串达到给定的长度。这个方法非常适用于格式化数字或在字符串前添加填充字符。
str.padStart(targetLength, padString)
语法
- targetLength:目标长度,填充后的字符串长度。
- padString:用于填充的字符串(默认为空格)。
示例
const str = '5';
const padded = str.padStart(2, '0'); // 输出 '05'
console.log(padded);
2. 使用 padEnd()
String.prototype.padEnd() 方法用于在当前字符串的结尾填充指定的字符,直到字符串达到给定的长度。这个方法对于需要在字符串后添加字符的情况非常有用
语法
str.padEnd(targetLength, padString)
- targetLength:目标长度,填充后的字符串长度。
- padString:用于填充的字符串(默认为空格)
示例
const str = '5';
const padded = str.padEnd(2, '0'); // 输出 '50'
console.log(padded);
3. 手动填充字符串
在 padStart() 和 padEnd() 方法出现之前,开发者常常使用字符串拼接来实现填充。这种方法虽然简单,但在处理复杂填充时可能不够灵活。
示例
const str = '5';
const paddedStart = '0' + str; // 输出 '05'
const paddedEnd = str + '0'; // 输出 '50'
console.log(paddedStart, paddedEnd);
4. 使用 repeat() 方法与切片
ES6 的 String.prototype.repeat() 方法可以用来创建重复的字符串,通过与 slice() 结合使用,可以实现灵活的填充效果。
语法
'char'.repeat(count)
- char是指定的字符串
- count是指定的字符串的副本数量
示例
const str = '5';
const padded = ('0'.repeat(2) + str).slice(-2); // 输出 '05'
console.log(padded);
5.使用模板字符串
模板字符串(模板字面量)可以使填充操作更具可读性和灵活性,特别是在处理复杂的填充逻辑时。
示例
const str = '5';
const padded = `${'0'.repeat(2 - str.length)}${str}`; // 输出 '05'
console.log(padded);