字符串和正则表达式（下）

其他正则表达式语法变更

正则表达式y修饰符

在字符串开始字符匹配时，它会影响正则表达式搜索过程中的sticky属性(表示是否设置了y修饰符)。它会通知搜索从正则表达式的lastIndex属性开始进行，如果在指定位置未能成功匹配则停止继续匹配

let text = 'hello1 hello2 hello3',
  pattern = /hello\d\s?/,
  result = pattern.exec(text),
  globalPattern = /hello\d\s?/g,
  glogbalResult = globalPattern.exec(text),
  stickyPattern = /hello\d\s?/y,
  stickyResult = stickyPattern.exec(text);

console.log(result[0])//hello1
console.log(glogbalResult[0])//hello1
console.log(stickyResult[0])//hello1
pattern.lastIndex = 1
globalPattern.lastIndex = 1
stickyPattern.lastIndex = 1
result = pattern.exec(text)
glogbalResult = globalPattern.exec(text)
stickyResult = stickyPattern.exec(text)
console.log(result[0])//hello1
console.log(glogbalResult[0])//hello2
console.log(stickyResult[0])//报错

关于修饰符有2点：
1、只有调用exec和test方法才会涉及lastIndex
2、当lastIndex的值为0时，如果正则表达式中含有^则是否使用粘滞正则表达式并无差别，如果lastIndex的值不为0则该表达式永远不会匹配到正确结果

let pattern=/hello\d/y
console.log(pattern.sticky)//true

正则表达式复制

ES5中复制正则表达式只能这样

var re1 = /ab/i,
    re2 = new RegExp(re1);

ES5中如果想要对re1重新指定修饰符则不行，ES6 增加了这一新功能。

var re1 = /ab/i,
    re2 = new RegExp(re1, "g")
console.log(re1)//   /ab/i
console.log(re2)//   /ab/g
console.log(re1.test('ab'))//true
console.log(re2.test('ab'))//true
console.log(re1.test('AB'))//true
console.log(re2.test('AB'))//false

这段代码中，变量re1使用了i修饰符（大小写无关特性），使用RegExp构造函数将其复制为新变量re2时，用g修饰符代替了i修饰符。如果不传入第二个参数，则re1和re2使用相同修饰符。

flags属性

ES5中通过source属性获取正则表达式的文本，ES6中新增flags属性获取使用的修饰符。这两个属性都是只读的原型属性访问器。

let re=/ab/g
console.log(re.source)// ab
console.log(re.flags)// g   --ES新增的属性

模板字面量

JS的字符串相对其他语言来说功能总是有限的，事实上，ES5中一直缺乏许多特性，如多行字符串、字符串格式化、HTML转义等。ES6通过模板字面量的方式进行了填补，模板字面量试着跳出JS已有的字符串体系，通过一些全新的方法来解决类似的问题。

基本用法

模板字面量是增强版的字符串，它用反引号（`）标识

let message = `Hello world!`;
console.log(message); // "Hello world!"
console.log(typeof message); //"string"
console.log(message.length);// 12

以上代码中，使用模板字面量语法创建一个字符串，并赋值给message变量，这时变量的值与一个普通的字符串无异
如果想在字符串中包含反引号，只需使用反斜杠（\ ）转义即可

let message = `\`Hello\` world!`;
console.log(message); // "`Hello` world!"
console.log(typeofmessage);//"string"
console.log(message.length);// 14

多行字符串

自javascript诞生起，开发者们就一直在寻找一种能创建多行字符串的方法。如果使用双引号或单引号，字符串一定要在同一行才行。在ES6之前多行字符串只能在一个新行最前方添加反斜杠来承接上一行代码

var message='Multiline\
string'

console.log(message) //"Multilinestring"

message字符串打印输出时不会有换行，因为反斜线被视为延续符号而不是新行的符号。为了在输出中显示换行，需要手动加入换行符

varmessage = "Multiline \n\string";// "Multiline 
                                    // string"
console.log(message);

在所有主流的JS 引擎中，此代码都会输出两行，但是该行为被认定为一个bug ，并且许多开发者都建议应避免这么做。
在ES6之前，通常都依靠数组或字符串的拼接来创建多行字符串.

ES6的模板字面量使多行字符串更易创建，因为它不需要特殊的语法，只需在想要的位置直接换行即可，此处的换行会同步出现在结果中

var message=`Multiline\
string`

console.log(message) //"Multiline
                     //string"

在反引号之内的所有空白符都是字符串的一部分，因此需要特别留意缩进

let message = `Multiline
            string`;
console.log(message);// "Multiline
                                    // string"
console.log(message.length); //19

以上代码中，模板字面量第二行前面的所有空白符都被视为字符串自身的一部分
如果一定要通过适当的缩进来对齐文本，可以考虑在多行模板字面量的第一行空置并在后面的几行缩进。

let html = `

    
Title
`.trim();

以上代码中，模板字面量的第一行没有任何文本，第二行才有内容。HTML标签的缩进增强了可读性，之后再调用trim()方法移除了起始的空行。也可以在模板字面量中使用\n 来指示换行的插入位置。

let message =`Multiline\nstring`;
console.log(message);// "Multiline
                     // string" 
console.log(message.length); // 16

字符串占位符

模板字面量看上去仅仅是普通JS字符串的升级版，但二者之间真正的区别在于模板字面量的变量占位符。变量占位符允许将任何有效的JS表达式嵌入到模板字面量中，并将其结果输出为字符串的一部分
变量占位符由起始的 ${ 与结束的 } 来界定，之间允许放入任意的JS 表达式。最简单的变量占位符允许将本地变量直接嵌入到结果字符串中。

let name = "Nicholas",
    message =`Hello, ${name}.`;
console.log(message); // "Hello, Nicholas."

占位符 ${name} 会访问本地变量name ，并将其值插入到message 字符串中。message变量会立即保留该占位符的结果
既然占位符是JS表达式，那么可替换的就不仅仅是简单的变量名。可以轻易嵌入运算符、函数调用等。

let count = 10,
    price = 0.25,
message = `${count} items cost $${(count * price).toFixed(2)}.`;
console.log(message); // "10 items cost $2.50."
function fn() { 
  return"Hello World";
}
console.log(`foo ${fn()} bar`)// foo Hello World bar

模板字面量本身也是JS 表达式，因此可以将模板字面量嵌入到另一个模板字面量内部。

let name = "Nicholas",
    message =`Hello, ${`my name is ${ name }`}.`;
console.log(message); // "Hello, my name is Nicholas."

标签模版

每个模版标签都可以执行模版字面量上的转换并返回最终的字符串值。标签指的是在模版字面量第一个反撇号()前方标注的字符串。在下面这个示例中，应用与模版字面量hello world`的模版标签是tag。

let message = tag`hello world`

【定义标签】
标签可以是一个函数，调用时传入加工过的模板字面量各部分数据，但必须结合每个部分来创建结果。

• 第一个参数是一个数组，包含Javascript解释过后的字面量字符串。
• 第一个参数之后的所有参数都是每一个占位符的解释值。

标签函数通常使用不定参数特性来定义占位符，从而简化数据处理的过程。

function tag(literals, ...substitutions) { // 返回一个字符串}

为了进一步理解传递给tag函数的参数，查看以下代码。

var a = 10,
      b = 5;
tag`add is ${ a + b } sub is ${ a - b }.`;// 等同于tag(['add is ', ' sub is ', '.'], 15, 50);

其中传递进来的第一个参数"数组['add is ', ' sub is ', '.']"赋值给参数literals，substitutions前的省略号表明它是一个不定参数，所有传递进来的其它参数“每一个占位符的解释值”都被放到一个数组中，赋值给变量substitutions。

课本中的实例：

function passthru(literals, ...substitutions){
  let result="";
  // 根据substitutions的数量来确定循环的执行次数
  for (let i=0; i "10 items cost $2.50."

• 一个名为passthru()的函数，那么作为一个模板字面量标签，它会接受3个参数首先是一个literals数组，包含以下元素
  1、第一个占位符前的空字符串("")
  2、第一、二个占位符之间的字符串("items cost $")
  3、第二个占位符后的字符串(".")
• 下一个参数是变量count的解释值，传参为10，它也成为了substitutions数组里的第一个元素，最后一个参数是(count*price).toFixed(2)的解释值，传参为2.50，它是substitutions数组里的第二个元素。

当${}在首位时, 占位符为空字符串。

function passthru(literals, ...substitutions){
 console.log(literals) // Array ["", " items cost $", "."]
 console.log(substitutions)// Array [10, "2.50"]
}
let count = 10,
   price = 0.25,
   message = passthru`${count} items cost $${(count * price).toFixed(2)}.`;

否则，仔细观察下列literals输出的不同，""被替换成"Key:"了。

function passthru(literals, ...substitutions){
 console.log(literals) // Array ["Key:", " items cost $", "."]
 console.log(substitutions)// Array [10, "2.50"]
}
let count = 10,
   price = 0.25,
   message = passthru`Key:${count} items cost $${(count * price).toFixed(2)}.`;

【注意】literals里的第一个元素是一个空字符串，这确保了literals[0]总是字符串的始端，就像literals[literals.length-1]总是字符串的结尾一样。substitutions的数量总比literals少一个，这也意味着表达式substitutions.Iength === literals.Iength-1的结果总为true。
通过这种模式，我们可以将literals和substitutions两个数组交织在一起重组结果字符串。先取出literals中的首个元素，再取出substitution中的首个元素，然后交替继续取出每一个元素，直到字符串拼接完成。于是可以通过从两个数组中交替取值的方式模拟模板字面量的默认行为
此处的小窍门是使用substitutions.length来为循环计数，使用literals.Iength常常会越界。

【在模版字面量中使用原始值】
String.raw方法，往往用来充当模板字面量的处理函数，返回一个斜杠都被转义（即斜杠前面再加一个斜杠）的字符串，对应于替换变量后的模板字面量。

let message1 =`Multiline\nstring`,
message2 =String.raw`Multiline\nstring`;
console.log(message1);  // "Multiline
                      // string"
console.log(message2);  // "Multiline\\nstring"

String.raw`Hi\n${2+3}!`;// "Hi\\n5!"
String.raw`Hi\u000A!`;  // 'Hi\\u000A!'
// 如果原字符串的斜杠已经转义，那么String.raw不会做任何处理
String.raw`Hi\\n`// "Hi\\n"

• String.raw方法可以作为处理模板字面量的基本方法，它会将所有变量替换，而且对斜杠进行转义，方便下一步作为字符串来使用。
• 原生字符串信息同样被传入模版标签，标签函数的第一个参数是一个数组，它有一个额外的属性raw，是一个包含每一个字面值的原生等价信息的数据。

function raw(literals, ...substitutions){
 let result="";
 console.log(literals[0]);//"Multiline
                     //string"
 console.log(literals.raw[0]);// "Multiline\\nstring"
 // 根据substitutions的数量来确定循环的执行次数
 for (let i=0; i

---

小结

ES6完全支持Unicode，