持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第4天,点击查看活动详情
es6中新增了许多字符串的实例方法,这些方法也使代码更加简洁,下面我们来具体看下这些方法。
includes()、startsWith()、endsWith()
在此之前,js中可以用indexOf方法来判断一个字符串是否在另一个字符串中。现在,又新增了几种方法,includes方法用来判断原字符串是否包含参数字符串;startsWith方法用来判断参数字符串是否在原字符串的头部;endsWith方法用来判断参数字符串是否在原字符串的尾部。如下:
let str = 'Hello world!'
str.includes('o') // true
str.startsWith('Hello') // true
str.endsWith('!') // true
str.includes('Hello', 6) // false
str.startsWith('world', 6) // true
str.endsWith('Hello', 5) // true
如上代码,includes、startsWith、endsWith这三个方法均有2个参数,第一个字符串是要匹配的字符串,第二个参数在includes、startsWith方法中表示开始搜索的位置(注意索引从0开始),在endsWith方法中,第二个参数则是表示前n个字符。
repeat()
repeat()方法表示将原字符串重复n次,然后返回一个新的字符串,如下:
'hello'.repeat(2) // "hellohello"
'hello'.repeat(0) // ""
'hello'.repeat(2.9) // 'hellohello'
如上,repeat方法只有一个参数,表示重复几次,如果参数是小数,则会直接向下取整。
padStart()、padEnd()
padStart和padEnd方法均表示补全字符串的长度,比如我们希望一个字符串的长度是固定的位数展示,但实际上字符串的长度小于这个位数,这时候我们就需要按照一定规则对字符串进行长度补全。padStart方法是在字符串头部进行补全,padEnd方法是在字符串尾部进行补全。如下:
'c'.padStart(5, 'ab') // 'ababc'
'c'.padEnd(4, 'ab') // 'caba'
padStart和padEnd方法均接收两个参数,第一个是字符串补全的最大长度,第二个是用来补全字符串的字符。
这种使用场景在开发中还是很常见的,比如在时间的展示上,我们希望月份、日期以及时分秒的展示均是2位数展示,如果不足两位前面用0进行补充,那么就可以使用padStart方法,如下:
'9'.padStart(2, '0') // '09'
'12'.padStart(2, '0') // '12'
trimStart()、trimEnd()
trimStart和trimEnd方法和trim()方法一致,表示去除字符串中的空格,trimStart()是去除字符串头部的空格,trimEnd()是去除字符串尾部的空格。如下:
const str = ' abc '
str.trimStart() // "abc "
str.trimEnd() // " abc"
需要注意的是,这两种去除空格的方法,均是会返回新的字符串,不会对原始字符串进行更改。
replaceAll()
replace()方法用来将匹配的字符进行替换,但只能替换符合条件的第一个字符,如果要替换全部,只能使用正则表达式中的g修饰符。而replaceAll()方法可以替换所有匹配的字符,如下:
'aabbcc'.replace('b', 'x') // 'aaxbcc'
'aabbcc'.replaceAll('b', 'x') // 'aaxxcc'
at()
at方法是用来获取字符串指定位置的字符,其接收一个整数参数,也可以是负整数,负整数表示从末尾开始反向查找,如下:
const str = 'hello'
str.at(0) // "h"
str.at(-1) // "o"
如上代码,当参数为0时,表示获取字符串的第一个字符(索引从0开始),如果参数是-1,则表示获取倒数第一个字符,依次类推。