JavaScript——ES9新特性

一、对象展开

1. rest 参数

ES6 引入 rest 参数，用于获取函数的实参，用来替代 arguments。ES9 中将 rest 参数引入对象。

function connect({ host, port, ...user }) {
    console.log(host);
    console.log(port);
    console.log(user);
}
connect({
    host: '127.0.0.1',
    post: 3306,
    username: 'admin',
    pwd: '12345'
})

// 返回
// 127.0.0.1
// undefined
// { post: 3306, username: 'admin', pwd: '12345' }

2. 扩展运算符

对象扩展运算符可用来合并对象。

const phone = {
    brand: 'xiaomi'
}
const smartPhone = {
    model: 'xiaomi 10',
    price: 3299
}
const miX = {...phone, ...smartPhone }
console.log(miX);
// { brand: 'xiaomi', model: 'xiaomi 10', price: 3299 }

二、正则扩展

1. 命名捕获分组

?<url> 可以对分组匹配的结果命名，方便对结果做处理。

let str = '<a href="www.google.com">谷歌</a>';
const reg = /<a href="(?<url>.*)">(?<text>.*)<\/a>/;
const result = reg.exec(str);
console.log(result);

在返回结果中就会有

groups: [Object: null prototype] { url: 'www.google.com', text: '谷歌' }

2. 反向断言

判断匹配结果是否正确。根据目标内容的前边和后边来进行唯一性的识别。

let str = 'JS4d85wa45么454lall';
const reg = /(?<=么)\d+/;
const result = reg.exec(str);
console.log(result);
// 返回 [ '454', index: 11, input: 'JS4d85wa45么454lall', groups: undefined ]

3. dotAll 模式

dot 在正则中表示元字符（.），代表除换行符以外的任意单个字符。//gs 中的 s 表示 dotAll 模式，g 表示批量匹配。

let str = `
    <ul>
        <li>
            <a>肖申克的救赎</a>
            <p>上映时间：1994-09-10</p>
        </li>
        <li>
            <a>阿甘正传</a>
            <p>上映时间：1994-07-06</p>
        </li>
    </ul>`;

const reg = /<li>.*?<a>(.*?)<\/a>.*?<p>(.*?)<\/p>/gs;

let result;
let data = [];
while (result = reg.exec(str)) {
    data.push({ title: result[1], time: result[2] });
}
console.log(data);

// 返回
// [
//   { title: '肖申克的救赎', time: '上映时间：1994-09-10' },
//   { title: '阿甘正传', time: '上映时间：1994-07-06' }
// ]