在 ES8 中，新增了两个字符串方法 String.prototype.padStart() 和 String.prototype.padEnd()，它们可以用来在字符串前或后填充指定字符，以达到指定长度的效果。这两个方法的使用非常灵活，可以在前端开发中大大提高开发效率，本文将对这两个方法进行详细解析。
String.prototype.padStart()
String.prototype.padStart() 方法可以在字符串前面填充指定字符，以达到指定长度的效果。该方法的语法如下：
str.padStart(targetLength [, padString])
其中，targetLength 表示填充后字符串的长度，padString 表示用来填充的字符串，默认为空格。
下面是一个示例代码：
const str = 'abc'; console.log(str.padStart(6, '0')); // 输出：00abc console.log(str.padStart(6)); // 输出： abc
在第一个示例代码中，我们将 targetLength 设置为 6，padString 设置为 '0'，则 str 在前面填充两个 '0'，最终输出为 '00abc'。
在第二个示例代码中，我们只设置了 targetLength 为 6，没有设置 padString，则 str 在前面填充了三个空格，最终输出为 ' abc'。
String.prototype.padEnd()
String.prototype.padEnd() 方法可以在字符串后面填充指定字符，以达到指定长度的效果。该方法的语法如下：
str.padEnd(targetLength [, padString])
其中，targetLength 表示填充后字符串的长度，padString 表示用来填充的字符串，默认为空格。
下面是一个示例代码：
const str = 'abc'; console.log(str.padEnd(6, '0')); // 输出：abc00 console.log(str.padEnd(6)); // 输出：abc
在第一个示例代码中，我们将 targetLength 设置为 6，padString 设置为 '0'，则 str 在后面填充两个 '0'，最终输出为 'abc00'。
在第二个示例代码中，我们只设置了 targetLength 为 6，没有设置 padString，则 str 在后面填充了三个空格，最终输出为 'abc '。
应用场景
String.prototype.padStart() 和 String.prototype.padEnd() 方法在前端开发中的应用场景非常广泛，比如：
- 在表格中，如果想要让表格中的每一行左对齐，可以使用
String.prototype.padStart()方法填充空格； - 在打印日志时，如果想要让日志信息对齐，可以使用
String.prototype.padEnd()方法填充空格； - 在处理数字时，如果想要将数字转为指定长度的字符串，可以使用
String.prototype.padStart()方法填充 '0'。
总结
String.prototype.padStart() 和 String.prototype.padEnd() 方法是 ES8 中新增的字符串方法，它们可以在字符串前或后填充指定字符，以达到指定长度的效果。这两个方法非常灵活，可以在前端开发中大大提高开发效率。在实际开发中，我们可以根据具体的需求选择使用哪个方法，并灵活运用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65db2b2a1886fbafa48392d6