在 ES7 中，我们可以使用 String.prototype.padStart() 和 String.prototype.padEnd() 方法来填充字符串。这两个方法可以让我们更方便地处理字符串的长度问题。本文将详细介绍这两个方法的使用方法和技巧，并给出示例代码。
String.prototype.padStart()
String.prototype.padStart() 方法用于在当前字符串的开始位置，填充指定的字符串，使得当前字符串达到指定的长度。这个方法的语法如下：
str.padStart(targetLength [, padString])
其中，targetLength 是要达到的长度，padString 是用于填充的字符串，默认为 " "。如果当前字符串的长度已经大于或等于 targetLength，则不会进行填充。
下面是一个简单的示例：
const str = "123"; const paddedStr = str.padStart(5, "0"); console.log(paddedStr); // "00123"
在这个示例中，我们将 str 用 "0" 填充，使得它的长度达到了 5。因此，输出的结果为 "00123"。
除了填充数字外，padStart() 方法还可以用于填充字符串。例如：
const str = "hello"; const paddedStr = str.padStart(10, "world "); console.log(paddedStr); // "world hello"
在这个示例中，我们将 str 用 "world " 填充，使得它的长度达到了 10。因此，输出的结果为 "world hello"。
String.prototype.padEnd()
String.prototype.padEnd() 方法用于在当前字符串的结束位置，填充指定的字符串，使得当前字符串达到指定的长度。这个方法的语法和 padStart() 方法类似：
str.padEnd(targetLength [, padString])
其中，targetLength 是要达到的长度，padString 是用于填充的字符串，默认为 " "。如果当前字符串的长度已经大于或等于 targetLength，则不会进行填充。
下面是一个简单的示例：
const str = "123"; const paddedStr = str.padEnd(5, "0"); console.log(paddedStr); // "12300"
在这个示例中，我们将 str 用 "0" 填充，使得它的长度达到了 5。因此，输出的结果为 "12300"。
和 padStart() 方法一样，padEnd() 方法也可以用于填充字符串。例如：
const str = "hello"; const paddedStr = str.padEnd(10, " world"); console.log(paddedStr); // "hello world"
在这个示例中，我们将 str 用 " world" 填充，使得它的长度达到了 10。因此，输出的结果为 "hello world"。
技巧和注意事项
使用 padStart() 和 padEnd() 方法时，有一些技巧和注意事项：
- 如果不传入
padString参数，则默认使用空格填充。 - 如果
targetLength小于或等于当前字符串的长度，则不进行填充。 - 如果
padString的长度大于targetLength减去当前字符串长度，则会截取padString的前面几个字符进行填充。 padStart()和padEnd()方法都不会修改原始字符串，而是返回一个新的填充后的字符串。
下面是一些示例代码，演示了这些技巧和注意事项：
-- -------------------- ---- ------- ----- --- - -------- -- -------- ------------------------------ -- - ------ ---------------------------- -- ------ - -- ----- ----------------------------- -- ------- --------------------------- -- ------- -- -- --------- ----------- ---------------------------- ---------- -- ----------- -------------------------- ---------- -- ------------
总结
在本文中，我们介绍了 ES7 中使用 String.prototype.padStart() 和 String.prototype.padEnd() 方法填充字符串的技巧，包括方法的语法、使用示例和注意事项。通过这些技巧，我们可以更方便地处理字符串的长度问题，提高代码的可读性和可维护性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65f4520c2b3ccec22fcac1a6