ECMAScript 2017 是 JavaScript 的新版本，其中新增了 padStart 和 padEnd 方法，这两个方法可以用于字符串的补全，是非常实用的字符串操作工具。本文将介绍这两个方法的使用技巧，帮助读者更好地掌握字符串补全的方式。
padStart 方法
padStart 方法的作用是在字符串的开头添加指定数量的字符，直到字符串长度达到指定长度。其语法如下：
str.padStart(targetLength [, padString])
其中：
- targetLength：需要补全的总长度，该参数必须是一个大于等于字符串长度的正整数。
- padString：用于补全的字符串，默认为空格，如果传入的字符串长度小于等于目标长度，则多余的补全字符将被截断，如果传入的字符串长度大于目标长度，截断后将覆盖原始字符串的一部分内容。
下面是几个使用 padStart 方法的示例：
// 使用默认的空格补全
console.log('1'.padStart(2, '0')); // 输出 '01'
console.log('10'.padStart(2, '0')); // 输出 '10'
// 使用其他字符进行补全
console.log('Vanessa'.padStart(10, 'a')); // 输出 'aaVanessa'
console.log('Vanessa'.padStart(10, 'ab')); // 输出 'abVanes'padEnd 方法
padEnd 方法与 padStart 方法的作用类似，但是它是在字符串的末尾添加指定数量的字符，直到字符串长度达到指定长度。其语法如下：
str.padEnd(targetLength [, padString])
其中的参数作用同 padStart 方法的参数一样，这里不再赘述。下面是几个使用 padEnd 方法的示例：
// 使用默认的空格补全
console.log('1'.padEnd(2, '0')); // 输出 '10'
console.log('10'.padEnd(2, '0')); // 输出 '10'
// 使用其他字符进行补全
console.log('Vanessa'.padEnd(10, 'a')); // 输出 'Vanessaaaa'
console.log('Vanessa'.padEnd(10, 'bc')); // 输出 'Vanessab'实际应用
字符串补全在实际应用中非常实用，比如在输出时间戳的时候，需要将数字转换成固定长度的字符串，这时就可以用 padStart 方法进行补全。另外，如果需要输出等宽的表格，则可以使用 padEnd 方法来对齐单元格。下面是一个实际应用的例子：
-- -------------------- ---- ------- -- ----- ----- --------- - ----------- ----- --- - --------------------------------- ----- ----------------- -- -- --------------- -- ------ ------------------------------ ---------------- -------------------- --------------------------------- --------------- -------------------- ----------------------------- --------------- ------------------
总结
padStart 和 padEnd 方法可以方便地实现字符串补全的操作，提高代码编写的效率。需要注意的是，补全字符如果长度过长，则会被截断；如果长度过短，则无法实现补全的目的。在实际应用中，可以根据具体需求选择合适的补全方式。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64a3710c48841e9894fc73e4