第 5 章 ECMASript 9 新特性

5.1.Rest/Spread 属性

• Rest 参数与 spread 扩展运算符在 ES6 中已经引入，不过 ES6 中只针对于数组，在 ES9 中为对象提供了像数组一样的 rest 参数和扩展运算符

// 扩展运算符对对象的使用
function connect({host, port, ...user}) {
    console.log(host);
    console.log(port);
    console.log(user);
}

connect({
    host: "localhost",
    port: 8080,
    username: 'root',
    password: 'root',
    type:'mysql'
});

const skillOne = {
    q: 'What is your name?'
}

const skillTwo = {
    w: 'What is your age?'
}

const skillThree = {
    e: 'What is your favorite color?'
}

// 将这三个对象用扩展运算符组装到一起
const skills = {...skillOne,...skillTwo,...skillThree};

5.2 正则表达式命名捕获组

• ES9 允许命名捕获组使用符号?<name>,这样获取捕获结果可读性更强，其中name是分组名

// 声明一个字符串
let str = '<a href = "http://www.baidu.com">百度</a>';
// 提取url与标签文本
const reg = /<a href = "(.*)">(.*)<\/a>/;
// 执行匹配
const result = reg.exec(str);
// 打印结果
console.log(result); // ["<a href = \"URL_ADDRESS">百度</a>", "URL_ADDRESS", "百度", index: 0, input: "<a href = \"URL_ADDRESS">百度</a>", groups: undefined]

// 使用命名捕获组
const reg2 = /<a href = "(?<url>.*)">(?<text>.*)<\/a>/;
const result2 = reg2.exec(str);
console.log(result2); // ["<a href = \"URL_ADDRESS\">百度</a>", "URL_ADDRESS", "百度", index: 0, input: "<a href = \"URL_ADDRESS\">百度</a>", groups: { url: "URL_ADDRESS", text: "百度" }]

5.3 正则表达式反向断言

• ES9 支持反向断言，通过对匹配结果前面的内容进行判断，对匹配进行筛选。

// 声明字符串
let str = 'jd3423543岗厦北555来来来';

// 正向断言
const reg = /\d+(?=来)/;
const result = reg.exec(str);
console.log(result);;

// 反向断言
const reg2 = /(?<=北)\d+/;
const result2 = reg2.exec(str);
console.log(result2); 

5.4 正则表达式 dotAll 模式

正则表达式中点.匹配除换行符的任何单字符，标记『s』改变这种行为，允许行终止符出现

// dot . 元字符 除换行符以外的任意单个字符
let str = `
<ul>
  <li>
    <a>肖申克的救赎</a>
    <p>上映日期：1994-09-10</p>
  </li>
</ul>
<ul>
  <li>
    <a>阿甘正传</a>
    <p>上映日期：1994-07-06</p>
  </li>
</ul>`;
// 声明正则
// 这里后面的？号表示禁止贪婪匹配（匹配到后面的a和p标签的内容
const reg = /<li>\s+<a>(.*?)<\/a>\s+<p>(.*?)<\/p>/;     
// 执行匹配
const result = reg.exec(str);
// 打印结果
console.log(result);
// 打印匹配结果
console.log(result[0]);

// 用dotAll模式
//.*?在这里表示空格字符，g是全局匹配，s表示可以匹配换行符
const reg2 = /<li>.*?<a>(.*?)<\/a>.*?<p>(.*?)<\/p>/gs;
let result2;
let data = [];
while (result2 = reg2.exec(str)) {
  data.push({title: result2[1], time: result2[2]});
}
// 输出结果
console.log(data);