字符串的扩展

102 阅读3分钟

下面这些是我这几天看es6字符串扩展的盲区,挑出了些觉得可能用的上的特此记录一下

codePointAt()、charAt()、charCodeAt()

  • charAt()用于返回字符串的第几个字符,匹配不到则返回空字符串
      let s = 'abcd'
      console.log(s.charAt(0))//"a"
      console.log(s.charAt(1))//"b"
      console.log(s.charAt(2))//"c"
      console.log(s.charAt(3))//"d"
      console.log(s.charAt(4))//""
  • codePointAt()与charCodeAt()我觉得这两个都是返回某位字符的字符编码,至于有什么不同嘛,看了文档大致是说charCodeAt是根据码元来匹配,codePointAt是根据码点来进行匹配的。举的例子是一个'𠮷'
    let s = 'a'
    console.log(s.charCodeAt(0))//97
    console.log(s.codePointAt(0))//97
    //一个字符到现在为止还算正常,那么当换成'𠮷'的时候
    s = '𠮷'
     console.log(s.charCodeAt(0))//55362
    console.log(s.codePointAt(0))//134071

我现在也是一脸蒙德的状态,那么什么是码元神又是码点能,回头我查查搞清楚了一定把这块不上

通过位置取字符at()

  • 还是拿刚才讨厌的字符'𠮷'来举例,'𠮷'的字符编码是"\ud842\udfb7"而当我们用charAt()取字符的时候发现并不会满足我们的需求
    let s = '𠮷'
    console.log(s.charAt(0))//"\ud842"
    console.log(s.charAt(1))//"\udfb7"

如上并不是我们要的结果那么我们就需要试试at()了

let s ='𠮷'
s.at()//"𠮷"

//那么负数会怎样呢
const str = 'hello';
str.at(1) // "e"
str.at(-1) // "o"

查找字符includes()、startsWith()、endsWith()

  • includes() :返回布尔值,表示是否找到了参数字符串。
  • startsWith() :返回布尔值,表示参数字符串是否在原字符串的头部。
  • endsWith() :返回布尔值,表示参数字符串是否在原字符串的尾部。

这三个方法都有两个参数(匹配的字符,搜索位置)当然使用的时候如果第二个参数不传的话,默认是从索引0开始的

    let s = 'Hello world!';

    s.startsWith('Hello') // true
    s.endsWith('!') // true
    s.includes('o') // true

    let s = 'Hello world!';

    s.startsWith('world', 6) // true
    s.endsWith('Hello', 5) // true
    s.includes('Hello', 6) // false

字符补全 padStart(),padEnd()

主要作用将原有字符串扩展到一定长度并补全相应的字符串

  • padStart() 在原有字符前面补全
  • padEnd() 在原有字符后面补全

这两个函数也支持两个参数(长度,需补全的字符串),如果第二个参数不传默认为空字符串

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

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

//如果长度小于原字符串长度会返回原字符串
'xxx'.padStart(2, 'ab') // 'xxx'
'xxx'.padEnd(2, 'ab') // 'xxx'

去除空格 trimStart(),trimEnd()

这就不得不提到trim()这个函数了,这个函数是去除首尾空格

  • trimStart() 去除头空格
  • trimEnd() 去除尾空格
    const s = '  abc  ';

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

字符串替换replaceAll()

之前一直用这个方法做字符串全部替换,而我发现了一些不一样的东西

replaceAll()第一个参数可以是字符串也可以是正则表达式,第二个参数既可以是字符串也可以是一个回调函数

//正则用法
'aabbcc'.replace(/b/g, '_')
// 'aa__cc'
//函数用法
'aabbcc'.replaceAll('b', () => '_')
// 'aa__cc'

//混搭
const str = '123abc456';
const regex = /(\d+)([a-z]+)(\d+)/g;

function replacer(match, p1, p2, p3, offset, string) {
  return [p1, p2, p3].join(' - ');
}

str.replaceAll(regex, replacer)
// 123 - abc - 456