ES9 新特性 ------ 扩展运算符

在ES9 中 为对象提供了像数组一样的 rest 参数和扩展运算符。

… 扩展运算符

  1. …user 涵盖了对象里面 username 之后的键值
	function connect({
    
    host, port, ...user}){
    
    
        console.log(host)
        console.log(port)
        console.log(user)
    }

    connect({
    
    
        host:'127.0.0.1',
        port: 3306,
        username: 'root',
        password: 'root'
    })

在这里插入图片描述

  1. 扩展运算符对对象的操作(将对象展开,形成对象序列)
	const one = {
    
    one: '西游记'}
    const two = {
    
    two: '水浒传'}
    const three = {
    
    three: '三国演义'}
    const four = {
    
    four: '红楼梦'}

    const classic = {
    
    ...one, ...two, ...three, ...four}
    console.log(classic) 

正则扩展 —— 命名捕获分组

ES5的方法:

	// 声明一个字符串
    let str = '<a href="http://www.atguigu.com">百度</a>'

    // 提取 url 与 [标签文本]
    const reg = /<a href="(.*)">(.*)<\/a>/

    // 执行
    const result = reg.exec(str)

    console.log(result[1]) // http://www.baidu.com
    console.log(result[2]) // 百度

ES9新增方法:

	// 声明一个字符串
    let str = '<a href="http://www.baidu.com">百度</a>'

    // 提取 url 与 [标签文本]
    const reg = /<a href="(?<url>.*)">(?<text>.*)<\/a>/

    // 执行
    const result = reg.exec(str)

    console.log(result.groups.url) // http://www.baidu.com
    console.log(result.groups.text) //百度

注:groups(),它返回一个包含唯一或所有子组的元组。

正则扩展 —— 反向断言

  1. 正向断言
	// 声明一个字符串
    let str = 'JS5211314你知道么555啦啦啦'
    // 正向断言(根据后面的内容,判断前面的内容是否合法)
    const reg = /\d+(?=啦)/

    const result = reg.exec(str)
    console.log(result)

在这里插入图片描述

  1. 反向断言
// 声明一个字符串
        let str = 'JS5211314你知道么555啦啦啦'
        
        const reg = /(?<=么)\d+/
        const result = reg.exec(str)
        console.log(result)

在这里插入图片描述

正则扩展 —— dotAll 模式

dot . 元字符 除换行符以外的任意单个符号

需求:把 ul 的电影名称和上映时间提取出来

	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 data = []
    let result
    while(result = reg.exec(str)){
    
    
        console.log(result)
        data.push({
    
    title: result[1], time: result[2]})
    }

在这里插入图片描述
不积跬步无以至千里 不积小流无以成江海

猜你喜欢

转载自blog.csdn.net/qq_45902692/article/details/123301090