在 ECMAScript 2018 中，新增了两个字符串方法：String.prototype.padStart() 和 String.prototype.padEnd()。这两个方法可以用来在字符串的开头或结尾填充指定的字符，使得字符串达到指定的长度。本文将详细介绍这两个方法的用法和示例代码，并探讨它们的学习和指导意义。
String.prototype.padStart()
String.prototype.padStart() 方法可以在字符串的开头填充指定的字符，使得字符串达到指定的长度。它接受两个参数：
targetLength：填充后字符串的目标长度。padString：填充的字符。如果该参数为多个字符，则只取第一个字符。
示例代码如下：
----- --- - -------- ----- --------- - ---------------- ----- ----------------------- -- ------------
在上面的例子中，我们将字符串 str 填充为长度为 10 的字符串，填充的字符为 *。由于 str 的长度为 5，因此会在开头填充 5 个 *，使得字符串达到长度为 10。
如果目标长度小于或等于原字符串的长度，则不进行填充：
----- --- - -------- ----- --------- - --------------- ----- ----------------------- -- -------
在上面的例子中，由于目标长度为 3，小于原字符串 str 的长度 5，因此不进行填充，直接返回原字符串。
如果填充的字符是多个字符，则只取第一个字符：
----- --- - -------- ----- --------- - ---------------- ------- ----------------------- -- ------------
在上面的例子中，填充的字符为 ***，但实际上只取了第一个字符 * 进行填充。
String.prototype.padEnd()
String.prototype.padEnd() 方法与 String.prototype.padStart() 方法类似，只不过是在字符串的结尾填充指定的字符。它也接受两个参数：
targetLength：填充后字符串的目标长度。padString：填充的字符。如果该参数为多个字符，则只取第一个字符。
示例代码如下：
----- --- - -------- ----- --------- - -------------- ----- ----------------------- -- ------------
在上面的例子中，我们将字符串 str 填充为长度为 10 的字符串，填充的字符为 *。由于 str 的长度为 5，因此会在结尾填充 5 个 *，使得字符串达到长度为 10。
如果目标长度小于或等于原字符串的长度，则不进行填充：
----- --- - -------- ----- --------- - ------------- ----- ----------------------- -- -------
在上面的例子中，由于目标长度为 3，小于原字符串 str 的长度 5，因此不进行填充，直接返回原字符串。
如果填充的字符是多个字符，则只取第一个字符：
----- --- - -------- ----- --------- - -------------- ------- ----------------------- -- ------------
在上面的例子中，填充的字符为 ***，但实际上只取了第一个字符 * 进行填充。
总结
String.prototype.padStart() 和 String.prototype.padEnd() 方法可以很方便地对字符串进行填充操作，使得字符串达到指定的长度。它们的学习和指导意义在于：
- 提高代码的可读性和可维护性。使用这两个方法可以更加清晰地表达代码的意图，减少代码的冗余和复杂度。
- 增强代码的兼容性。由于这两个方法是 ES2018 中新增的方法，因此使用它们可以提高代码的兼容性，减少因为浏览器版本不同而导致的兼容性问题。
建议在日常开发中积极使用这两个方法，以提高代码的质量和效率。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/65fa28ebd10417a2225f9c82