ES8 中的插入字符串 PadStart 和 PadEnd 函数

在 ES8 中，新增了两个字符串函数 PadStart 和 PadEnd，用于在字符串前后插入指定的字符，以实现字符串对齐的效果。这两个函数可以提高字符串操作的效率和代码的可读性，特别是在前端开发中，经常需要对字符串进行处理，因此掌握这两个函数对于前端开发人员来说非常重要。

PadStart 函数

PadStart 函数用于在字符串前面插入指定的字符，以达到字符串对齐的效果。它接受两个参数，第一个参数是插入后的字符串总长度，第二个参数是插入的字符。如果原字符串长度大于或等于插入后的字符串总长度，则不进行插入操作。

下面是一个示例代码：

let str = 'ES8';
let result = str.padStart(5, '*');
console.log(result); // 输出：**ES8

在上面的代码中，padStart 函数将字符串 ES8 前面插入了两个星号 *，使得最终字符串的长度为 5，即 **ES8。

PadEnd 函数

与 PadStart 函数类似，PadEnd 函数用于在字符串后面插入指定的字符，以达到字符串对齐的效果。它也接受两个参数，第一个参数是插入后的字符串总长度，第二个参数是插入的字符。如果原字符串长度大于或等于插入后的字符串总长度，则不进行插入操作。

下面是一个示例代码：

let str = 'ES8';
let result = str.padEnd(5, '*');
console.log(result); // 输出：ES8**

在上面的代码中，padEnd 函数将字符串 ES8 后面插入了两个星号 *，使得最终字符串的长度为 5，即 ES8**。

案例应用

在实际开发中，PadStart 和 PadEnd 函数可以用于字符串对齐、填充空格等场景。下面是一个填充空格的示例代码：

let str = 'ES8';
let result = str.padStart(10, ' ').padEnd(15, ' ');
console.log(result); // 输出：      ES8      

在上面的代码中，padStart 函数将字符串 ES8 前面插入了 6 个空格，使得最终字符串的长度为 10，即 ES8，然后再使用 padEnd 函数在字符串后面插入 3 个空格，使得最终字符串的长度为 15，即 ES8 。

总结

PadStart 和 PadEnd 函数是 ES8 中新增的字符串函数，用于在字符串前后插入指定的字符，以实现字符串对齐的效果。它们可以提高字符串操作的效率和代码的可读性，特别是在前端开发中，经常需要对字符串进行处理。掌握这两个函数对于前端开发人员来说非常重要。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/655b2f28d2f5e1655d55ad0a