19. ES6+ padEnd() 方法

1. 1. 前言
2. 3. 使用场景
3. 4. 实例
4. 5. 场景实例（补全时间戳的毫秒）
5. 6. 小结

1. 前言

本节介绍 ES6 的字符串新增方法 padEnd() 和 padStart() 一样也是补全字符串的长度的，但是它的补全位置是在原字符串的右侧末尾进行补全的。此方法会返回一个新的字符串，不会对原字符串进行修改。

<h2″>2. 方法详情

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

使用语法：

str.padEnd(targetLength [, padString])

参数说明：

3. 使用场景

1. 扩展字符串长度
2. 设置指定字符串的长度
3. 在实战中补全时间戳的毫秒

4. 实例

1. 拼接字符串。

"mybjj".padEnd(10, 'ilove')    // "mybjjilove" 

2. 如果原字符串的长度，等于或小于最大长度，则字符串补全不生效，返回原字符串。

'mybjj'.padEnd(5, 'ab') // 'mybjj'
'mybjj'.padEnd(2, 'ab') // 'mybjj'

3. 如果补全的字符串和原字符串的长度大于目标（targetLength）的长度，补全的字符串会被截取。

'mybjj'.padEnd(7, 'abc') // 'mybjjab'

4. 如果补全的字符串和原字符串的长度小于目标（targetLength）的长度，补全的字符串会被重复，多余的部分会被裁剪。

'mybjj'.padEnd(9, 'ab') // 'mybjjabab'
'mybjj'.padEnd(10, 'ab') // 'mybjjababa'

5. 如果省略第二个参数，默认使用空格补全长度。

'mybjj'.padEnd('7')   // 'mybjj  '

5. 场景实例（补全时间戳的毫秒）

有时候我们处理后端返回的时间戳数据的时候，会发现很多都是秒，是 10 位，这主要是因为数据库存储的问题。这时候我们需要补全到毫秒，可以借助 padEnd 来进行补全操作。如下：

let timestamp = 1581828518
timestamp = String(timestamp).padEnd(13, '0'); // 1581828518000

String() 函数对时间戳 timestamp 进行类型转换，转换为字符串进行操作。

6. 小结

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

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