ES8 中新增的两个字符串方法：padStart() 和 padEnd()，用于在某个字符串的头部或尾部填充指定字符，使得字符串达到指定的长度。
这两个方法本身用起来并不复杂，但是它们提供了一个非常方便的方式来规范化字符串格式，特别是在输出文本的时候。以下是对这两个方法的详细讲解，帮助你更好地掌握它们的用法。
padStart()
padStart() 方法用于在字符串的头部填充指定字符，使得字符串达到指定的长度。它接受两个参数：
targetLength- 生成的字符串的长度。如果这个字符串的长度小于targetLength，则会在头部添加字符，以达到指定长度。padString- 要添加的字符。如果未指定，则默认使用空格。
下面是使用 padStart() 实现字符串头部填充的示例：
const str = "hello"; const padStr = "-"; console.log(str.padStart(8, padStr)); // 输出：---hello
在这个例子中，我们将我们的字符串 hello 用 - 填充，使得它的长度达到了 8。
如果我们没有指定 padString 参数，那么默认会填充空格。例如：
const str = "hello"; console.log(str.padStart(8)); // 输出： hello
padEnd()
padEnd() 方法用于在字符串的尾部填充指定字符，使得字符串达到指定的长度。它接受两个参数：
targetLength- 生成的字符串的长度。如果这个字符串的长度小于targetLength，则会在尾部添加字符，以达到指定长度。padString- 要添加的字符。如果未指定，则默认使用空格。
下面是使用 padEnd() 实现字符串尾部填充的示例：
const str = "hello"; const padStr = "-"; console.log(str.padEnd(8, padStr)); // 输出：hello---
在这个例子中，我们将我们的字符串 hello 用 - 填充，使得它的长度达到了 8。
如果我们没有指定 padString 参数，那么默认会填充空格。例如：
const str = "hello"; console.log(str.padEnd(8)); // 输出：hello
实战场景
看起来这两个方法有些简单，但在实际开发中，它们非常有用。下面是一些常见的实际使用场景：
1. 数字补位
我们有时候需要对数字进行补位，例如将数字 1 转化成 "01"。 padStart() 可以帮助我们非常方便地实现这一点。例如：
const num = "1"; console.log(num.padStart(2, "0")); // 输出：01
2. 打印表格
在打印表格时，填充空格可以帮助我们使表格中的列对齐。 padStart() 和 padEnd() 可以帮助我们实现这一点。例如：
-- -------------------- ---- ------- ----- ----- - - --------- --------- -------- ---------- -------- --------- ----------- --------- ------ -- --- ---- --- -- ------ - ------------------------------ ------------------ ------------------- -
这里，我们使用 padEnd 来填充每列，使得所有的列都对齐。
总结
ES8 中新增的 padStart() 和 padEnd() 两个方法为我们在字符串头部或尾部填充指定字符提供了一种简便的方式，让我们可以更快地规范化字符串的格式。虽然这两个方法很简单，但在实际开发中，它们非常有用，我们可以用它们来实现一些实用的功能。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/649e144148841e9894aa4416