引言
在 ES7 中新增加了 String 原型对象的两个方法： String.prototype.padStart() 和 String.prototype.padEnd() 。它们的作用是在字符串的开头或结尾填充一定的字符，以达到制定长度的目的。在前端开发中，这两个方法的使用频率很高，掌握这两个方法的用法能够提升我们的前端开发效率，本文就来详细介绍一下 String.prototype.padStart() 和 String.prototype.padEnd() 的用法。
String.prototype.padStart() 与 String.prototype.padEnd() 的用法
String.prototype.padStart() 和 String.prototype.padEnd() 都接受两个参数：length 和 fillString，其中 length 是填充后字符串的长度，fillString 是填充用的字符串（可选参数，默认填充空格）。如果原始字符串的长度已经超过或等于 length，这两个方法将返回原始字符串。
String.prototype.padStart()
String.prototype.padStart() 方法的作用是向字符串开头添加指定数量的字符以达到指定长度。
'hello'.padStart(10, '1234') // "12341hello" 'hello'.padStart(4, '1234') // "hello" 'hello'.padStart(11) // " hello"
上例中，'1234' 是用于填充的字符串，当字符串不足10位时在开头填充 '1234'，最终返回的字符串长度都是10个字符。
String.prototype.padEnd()
String.prototype.padEnd() 方法的作用是向字符串结尾添加指定数量的字符以达到指定长度。
'hello'.padEnd(10, '1234') // "hello12341" 'hello'.padEnd(4, '1234') // "hello" 'hello'.padEnd(11) // "hello "
和 String.prototype.padStart() 相反，String.prototype.padEnd() 是在字符串结尾添加点字符。
实际场景中的应用
这两个方法在前端代码中的应用非常广泛，例如我们需要在小数位数少于2位时自动在其尾部补齐零，那么可以使用 padEnd() 方法：
-- -------------------- ---- -------
-------- ------------- -
----- --- - ---------------
----- ------ - -----------
-- ------- - -- -
------ ---------------
-
------ ------------- ----
-
------------------------ -- ----
--------------------------- -- -----总结
String.prototype.padStart() 和 String.prototype.padEnd() 这两个方法是 ES7 中新增加的字符串操作方法，在前端的应用非常广泛。本文详细介绍了这两个方法的用法和示例，并且提供了 padEnd() 方法的一个实际应用场景。相信通过本文的学习，大家已经能够熟练掌握这两个方法的用法，提高前端代码的效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64661718968c7c53b06c393f