在 ES8 中，新增了 String Padding 特性，可以方便的实现字符串的填充操作，本文将介绍其使用方式以及应用场景，并提供示例代码进行演示。
String Padding 使用方式
String Padding 有两个方法，分别是 padStart() 和 padEnd()，分别用于在字符串前面和后面进行填充操作。
padStart()
padStart() 方法的使用方式如下：
str.padStart(targetLength, [paddingString])
其中 str 是要进行填充操作的字符串，targetLength 是填充后期望的总长度，paddingString 是用于填充的字符串，如果不填则默认使用空格。如果目标字符串的长度小于 targetLength，则在原字符串前面添加 paddingString 直到达到目标长度。
下面是一个示例：
const str = '123'; const paddedStr = str.padStart(5, '0'); // 需要填充两个 0 console.log(paddedStr); // 输出：'00123'
padEnd()
padEnd() 方法的使用方式与 padStart() 类似，只不过是在字符串后面进行填充操作。
str.padEnd(targetLength, [paddingString])
下面是一个示例：
const str = 'abc'; const paddedStr = str.padEnd(6, '-'); // 需要填充三个 - console.log(paddedStr); // 输出：'abc---'
应用场景
String Padding 在实际开发中非常实用，下面列举一些场景：
表格对齐
在表格中，为了让每一列的内容对齐，可能需要对字符串进行填充，以使其达到相同长度。
-- -------------------- ---- ------- ----- --------- - - --------- -------- ---------- -------- ---------- -------- -- --- ---- - - -- - - ----------------- ---- - ----- ------ ------ - ------------- ----- ---------- - --------------- - --- ----- ----------- - ----------------- - --- -------------------------- - ----------------- - -- --- -- ----- - ---- -- ------ - ---- -- ------ - ----
转化为固定长度的字符串
在某些场景下，可能需要将字符串转化为固定长度的字符串。
const id = 12345; const paddedId = id.toString().padStart(8, '0'); // 8位数 console.log(paddedId); // 输出：'00012345'
总结
String Padding 是一项非常实用的特性，在实际开发中可以用来解决很多问题，比如表格对齐和字符串长度处理等。当然，为了兼容性考虑，也需要注意在使用时进行相关的降级处理。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/645001e5980a9b385b933a96