ES6 字符串&正则表达式

Posted gaogao999

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ES6 字符串&正则表达式相关的知识,希望对你有一定的参考价值。

目录 第二章 字符串和正则表达式UTF-16码位codePointAt()方法String.fromCodePoint()方法normalize()方法正则表达式u修饰符其他字符串变更字符串中的字串识别repeat()方法其他正则表达式语法变更y修饰符正则表达式的复制flags属性模板字面量基础语法多行字符串字符串占位符标签模板定义标签原始值

第二章 字符串和正则表达式

UTF-16码位

在UTF-16中,前2^16^均以16位的编码单元表示,这个范围被称作基本多文种平面(BMP, Basic Multilingual Plane)。超出这个平面的码位则要归属于某个辅助平面(supplementary plane)。

UTF-16引入了代理对(surrogate pair),规定用两个16位编码单元表示一个码位。也就是说,字符串里的字符有两种,一种是由一个编码单位16位表示的BMP字符,另一种是由两个编码单元32位表示的辅助平面字符。

codePointAt()方法

这个方法接受编码单元的位置,而非字符串位置作为参数,返回与字符串中给定位置对应的码位,即一个整数值。

要检测一个字符占用的编码单元数量,可以调用该方法。

function is32Bit (c) 
  return c.codePointAt(0) > 0xFFFF;

String.fromCodePoint()方法

使用codePointAt()方法检索一个字符的码位,使用String.fromCodePoint()方法根据执行的码位生成一个字符。可以看作完整版的String.fromCharCode()。

normalize()方法

  • 规范的等效是指无论从哪个角度来看,两个序列的码位都是没有区别的。
  • 兼容性,两个互相兼容的码位序列看起来不同,但是在特定的情况下可以被互相交换使用。

normalize(str, type?)方法用于提供Unicode的标准化形式,同时可以接受一个可选参数来指明标准:

  • 以标准等价方式分解,然后以标准等价方式重组(“NFC”),默认选项
  • 以标准等价方式分解(“NFD”)
  • 以兼容等价方式分解(“NFKC”)
  • 以兼容等价方式分解,然后以标准等价方式重组(“NFKD”)

需要注意,在进行字符串的排序和比较操作前,将被操作字符串按照同一标准进行标准化。

正则表达式u修饰符

当一个正则表达式添加了u修饰符,它就从编码单元操作模式切换为字符模式,如此一来正则表达式就不会视代理对为两个字符,从而完全按照预期正常运行。例如(/^.$/u).test(str)。

使用这种方式可以计算码位的数量,解决length不能反映码位数量的问题:

function codePointLength (str) 
  // 使用\s\S来确保能匹配新行
    const result = str.match(/[\s\S]/gu);
  return result? result.length : 0;

检测其支持性:

function hasRegExpU () 
  try
    var pattern = new RegExp('.', 'u');
    return true;
   catch (err)
    return false;
  

其他字符串变更

字符串中的字串识别

  • includes()方法,如果在字符串中检测到指定文本则返回true,否则返回false。
  • startsWith()方法,如果在字符串的起始部分检测到指定文本则返回true,否则返回false。
  • endsWith()方法,如果在字符串的结束部分检测到指定文本则返回ture,否则返回false。

它们都有第二个可选参数,表示匹配起始点的索引值。注意endWith()是从后向前索引的。

repeat()方法

repeat()接受一个number参数,表示重复的次数,返回值是当前字符串重复一定次数后的新字符串。

其他正则表达式语法变更

y修饰符

它会影响正则表达式搜索过程中的sticky属性,当在字符串中开始字符匹配时,它会通知搜索从正则表达式的lastIndex属性开始进行,如果在指定位置没能成功匹配,则停止继续匹配。可以通过访问正则表达式的sticky属性来确定这个表达式是否使用了y。

当执行操作时,y操作符会把上次匹配后面一个字符的索引保存在lastIndex中;如果该操作匹配的结果为空,则lastIndex会被重置为0。g修饰符的行为与此相同。

需要注意,只有调用exex()和test()的时候才会涉及lastIndex属性,调用字符串的方法,如match(),就不会触发粘滞行为。

正则表达式的复制

在ES5中,var re2 = new RexExp(re1, ‘i‘)对原有正则表达式的修饰符进行修改会报错,但是ES6支持这种方式。

flags属性

source属性获取正则表达式文本,ES6新增的flags属性获取修饰符。

模板字面量

ES6通过模板字面量的形式填补了一些特性:

  • 多行字符串:一个正式的多行字符串概念
  • 基本的字符串格式化:将变量的值潜入字符串的能力,$param形式
  • html转义:向HTML插入经过安全转换后的字符串的能力

基础语法

模板字面量使用反撇号来实现,在内部使用反撇号时可以加上转义符号。

多行字符串

ES5中的做法是换行符\n来指示换行。

ES6的模板字面量支持直接换行书写。其所有空白符都属于字符串的一部分,需要注意缩进。

字符串占位符

使用$param的形式,将任何合法的javascript表达式嵌入到占位符中,并将其作为字符串的一部分输出到结果中。它可以访问作用域中所有可访问的变量。

let count = 10,
    price = 0.25,
    message = `$count items cost $(count * price).toFixed(2).`;

标签模板

定义标签

标签可以是一个函数,调用时传入加工过的模板字面量各部分数据。第一个参数是一个数组,包含JS解释过后的模板字面量字符串,它之后的所有参数都是每一个占位符的解释值。它可以执行对模板字面量内容的一系列处理。

function tag (literals, ...substitutions) 
  let result = '';
  
  // literals.length === substitutions.length + 1
  for (let i = 0; i < substitution.length; i++) 
    result += literals[i];
    result += substitutions[i];
  
  
  // 处理最后一个literal
  return result += literals[literals.length - 1];

message = tag`$count items cost $(count * price).toFixed(2).`;

原始值

literals.raw属性可以访问字符转义被转换成等价字符前的原生字符串。

以上是关于ES6 字符串&正则表达式的主要内容,如果未能解决你的问题,请参考以下文章

ES6正则表达式扩展

ES 正则

ES6学习总结之 正则表达式

ES6正则扩展

ES6 学习 ---正则的扩展

JavaScript ES6 - 正则表达式扩展