ES6+ padStart()教程

发布时间：2023-03-24 14:15:20 所属栏目：教程来源：

导读：本节介绍 ES6 的字符串新增方法 padStart，该方法是字符串补全长度的方法，如果某个字符串不够指定的字符串长度，可以使用此方法在字符串左侧开始位置进行补全。

padStart() 在原字符串开头填充指定的填充字符串直

本节介绍 ES6 的字符串新增方法 padStart，该方法是字符串补全长度的方法，如果某个字符串不够指定的字符串长度，可以使用此方法在字符串左侧开始位置进行补全。

padStart() 在原字符串开头填充指定的填充字符串直到目标长度并返回一个新的字符串，不会对原字符串进行修改。

使用语法：

str.padStart(targetLength [, padString])
参数说明：

参数   描述
targetLength   当前字符串需要填充到的目标长度。如果这个数值小于当前字符串的长度，则返回当前字符串本身
padString   (可选) 填充的字符串。如果字符串太长，使填充后的字符串长度超过了目标长度，则只保留最左侧的部分，其他部分会被截断。默认补全的字符串为 ' '

扩展字符串长度；
设置指定字符串的长度；
补全日期的时候会更加方便。

1. 拼接字符串。

"imooc".padStart(, 'ilove') // "iloveimooc"
2. 如果原字符串的长度，等于或小于最大长度，则字符串补全不生效，返回原字符串。

'imooc'.padStart(, 'ab') // 'imooc'
'imooc'.padEnd(, 'ab') // 'imooc'
3. 如果补全的字符串和原字符串的长度大于目标（targetLength）的长度，补全的字符串会被截取。

'imooc'.padStart(, 'abc') // 'abimooc'
4. 如果补全的字符串和原字符串的长度小于目标（targetLength）的长度，补全的字符串会被重复，多余的部分会被裁剪。

'imooc'.padStart(, 'ab') // 'ababimooc'
'imooc'.padStart(, 'ab') // 'ababaimooc'
5. 如果省略第二个参数，默认使用空格补全长度。

'imooc'.padStart('7') // ' imooc'

通常情况下用的比较多的就是在时间或者日期前面的补 0，比如：2020-06-03，但是通常我们使用时间戳获取日月时，是没有前面的 0 的，如：

var month = new Date().getMonth() + ; // 6
这个时候获取的是 2，没有前面的 0，如果我们想在月份前面加 0 需要进行逻辑判断，我们可以写这样一个函数来统一处理实现。

function getMonth(m) {
return m < ? `0${m}` : m;
}
当 m 小于 10 的时候，我们会在前面添加一个 0，否则直接返回 m 的值，虽然这样可以实现，但是这里多了一个函数，现在有了 padStart 就会很容易了。

var month = String(new Date().getMonth() + ).padStart(, '0');   // 06
var date = String(new Date().getDate()).padStart(, '0');            // 03
String() 函数对日期进行类型转换的作用，转换为字符串进行操作。

本节讲解了字符串的 padStart() 方法的使用，需要注意以下几点：

该方法不会对原字符串进行修改；
在没有第二个参数时，则用空格填充；
在实战中使用在日期前的补充会使代码变得非常简洁。

（编辑：汽车网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!