String类型

静态属性和方法

String类型 - 图1

实例化对象

string对象被是视为类数组对象,字符串的每个字符都有单独的索引,但是不可更改。
String类型 - 图2

原型方法

String类型 - 图3

注释说明

关于增补平面字符

  1. const str = new String('abc\u{12345}');
  2. console.dir(str);

image.png

修复索引增补平面字符的方法

  1. //这一段是关键代码,找到代理码点对,调整输入的索引值。
  2. //说明举例:
  3. //字符串是‘a\uD87E\uDC04b\uD87E\uDC04c’
  4. //0:a(0)
  5. //1:\uD87E\uDC04
  6. //2:b(3)
  7. //3:\uD87E\uDC04
  8. //4: c(6)
  9. //明显可以看出实际索引值,与目标的不同。
  10. var surrogatePairs = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g;
  11. while ((surrogatePairs.exec(str)) != null) {
  12. var li = surrogatePairs.lastIndex;
  13. if (li - 2 < idx) {
  14. idx++;
  15. }
  16. else {
  17. break;
  18. }
  19. }

String.prototype.match( )

关键点没有匹配项,返回null。
关键点标记g:返回所有匹配字符串的数组,不返回捕获项。
关键点没有标记g:返回第一个匹配的字符串,返回捕获项。

String.prototype.matchAll( )

image.png
关键点正则表达式必须有标记g,返回迭代器对象。
关键点对比RegExp.prototype.exec( )只可以使用循环语句迭代,matchAll可以使用for…of…、spread、Array.from( )自动迭代。

String.prototype.replace( )

关键点替换字符串中可以插入变量,这些变量必须使用$开头。

  1. //$$ = "$"
  2. //$& = 成功匹配的字符串
  3. //$` = 成功匹配的字符串前提下,前面的字符串
  4. //$' = 成功匹配的字符串前提下,后面的字符串
  5. //$n = 第n个捕获的字符串
  6. //$<name> = 捕获命名分组的字符串
  7. console.log('hello world'.replace(/he/g, '(h$&e)')); //(hhee)llo world
  8. console.log('hello world'.replace(/world/g, '($`)')); //hello (hello )
  9. console.log('hello world'.replace(/world/g, "($')")); //hello ()

关键点使用函数的结果作为替换字符串,内嵌函数的参数。

  1. 'hello world world'.replace(/(w)(o)(?<name>r)ld/g, (match, p1, p2, p3, offset, string, groups ) => {
  2. console.log(match, p1, p2, p3, offset, string, groups)
  3. return match;
  4. })
  5. world w o r 6 hello world world {name: 'r'}
  6. world w o r 12 hello world world {name: 'r'}

String.prototype.replaceAll( )

:::info 方法的第一个参数是字符串时,会匹配所有的字符,而不是只匹配第一个。其他的和replace一样。 :::

tag function

自定义模板字面量的插值行为。允许你使用自定义函数来解析模板字符串,而不是默认函数。

  1. //改变了模板字符串的默认输出。
  2. function tagFunction(strings, ...exp){
  3. console.log(strings) //['num', 'num', '.', raw: Array(3)]
  4. return strings.join('') + exp.join('');
  5. }
  6. tagFunction`num${1}num${2}.` //'numnum.12'

:::info 模板字符串本质上是将字符串和插值表达式作为参数传给一个默认函数,它的功能就是将插值表达式的值和字符串连接在一起。 :::

参考

https://typesafe.blog/article/the-logic-behind-javascript-tag-functions 标签函数背后的隐含意义