ES6 系列之字符串的扩展

# 带标签的模板字符串

模板字符串的功能，不仅仅是上面这些。它可以紧跟在一个函数名后面，该函数将被调用来处理这个模板字符串。这被称为“标签模板”功能（tagged template）。

// let age = 22; 
// let age2 = 33; 
// function tag(arr, arg, arg2) {

//     console.log(arr)
//     console.log(arg, arg2)

// }
// tag `my age is ${age} abc is ${age2}` ; 
// [ 'my age is ', ' abc is ', '' ]
// 22 33

1
2
3
4
5
6
7
8
9
10
11
12

# ES6 系列目录地址：

ES6 系列为了加深自己对ES6知识的理解，梳理知识结构。系列目录地址：

# 方法

repeat()

repeat()返回一个新字符串，表示将原字符串重复 n 次。

"x".repeat(3) // "xxx"
"hello".repeat(2) // "hellohello"

1
2

startsWith()：返回布尔值，表示参数字符串是否在源字符串的头部。

'123'.startsWith('1') // true

endsWith()：返回布尔值，表示参数字符串是否在源字符串的尾部。
padStart()，padEnd(), ES2017 引入了字符串补全长度的功能。如果某个字符串不够指定长度，会在头部或尾部补全。padStart()用于头部补全，padEnd()用于尾部补全。

 'x'.padStart(5, 'ab') // 'ababx'
 'x'.padStart(4, 'ab') // 'abax'

 'x'.padEnd(5, 'ab') // 'xabab'
 'x'.padEnd(4, 'ab') // 'xaba'

 'xxx'.padStart(2, 'ab') // 'xxx'
 'xxx'.padEnd(2, 'ab') // 'xxx'

 'abc'.padStart(10, '0123456789') // '0123456abc'

 'x'.padStart(4) // '   x'
 'x'.padEnd(4) // 'x   '

1
2
3
4
5
6
7
8
9
10
11
12
13

用途

padStart()的常见用途是为数值补全指定位数。下面代码生成 10 位的数值字符串。

'1'.padStart(10, '0') // "0000000001"
'12'.padStart(10, '0') // "0000000012"
'123456'.padStart(10, '0') // "0000123456"

1
2
3

另一个用途是提示字符串格式。

'12'.padStart(10, 'YYYY-MM-DD') // "YYYY-MM-12"
'09-12'.padStart(10, 'YYYY-MM-DD') // "YYYY-09-12"

1
2
3

trimStart()，trimEnd()

const s = '  abc  ';

s.trim() // "abc"
s.trimStart() // "abc  "
s.trimEnd() // "  abc"

1
2
3
4
5

带标签的模板字符串

ES6 系列目录地址：

方法