ES高阶（部分）

ES6--解构

数组解构

let ary = [1,2,3]

在ES6以前，我们赋值是这样写的：
ary[0]、ary[1]、ary[2]才能取值

在ES6，使用let关键字
let [a,b,c] = ary; //此时a=1,b=2,c=3

如果变量的数量和值的数量不匹配会怎么样
let [a,b,c,d,e] = ary; //此时a=1,b=2,c=3,d和e是undefined

对象解构

let person = {name:'zhangsan',age:20}
let {name,age} = person;
通过 对象的名字 来获取匹配 属性值
console.log(name) //zhangsan
console.log(age)  //20

扩展运算符的补充

扩展运算符可以将数组或对象，转为用逗号分割的参数序列

let ary = [1,2,3]

    使用扩展运算符
...ary  //1,2,3
    但是如果我用console.log输出，就没有逗号了
console.log(...ary)  //1 2 3
    因为逗号被当做console.log中的参数分隔符了
    
let z = { a: 3, b: 4 };
let n = { ...z };
n // { a: 3, b: 4 }    

扩展运算符可以用于合并数组

let ary1 = [1,2,3]
let ary2 = [4,5,6]
let ary3 = [...ary1,...ary3] //1,2,3,4,5,6

不能直接将ary2追加，但是使用...ary2会将数据拆分，这个时候就可以追加了
ary1.push(...ary2) //1,2,3,4,5,6 push从尾部追加

前言

async和await两种语法结合可以让异步代码像同步代码一样

async

//async函数
async function fn(){
    //返回结果是一个Promise对象
    return new Promise((resolve,reject)=>{
        resolve('成功')
    })
}
//如果return的是成功的值，那么result返回的就是成功的
const result = fn();

//调用then方法,如果result成功，就调用value，失败就调用reason
result.then(value=>{
    console.log(value)
},reason=>{
    //黄色显示
    console.warn(reason)
})

await

await必须和async一起使用，await是0

//创建promise对象
const p = new Promise((resolve,reject)=>{
    //resolve("成功")
    reject("失败啦")
})

//await必须放在async函数中
async function main(){
    // let result = await p; //p成功的值 成功
    // 如果p返回的是失败的值，那么await就要用try..catch捕获
    try{
        let result = await p
        console.log(result)
    } catch(e){
        console.log(e) // 在catch中捕获失败的数据，进行处理
    }
}

正则扩展-命名捕获分组

reg.exec()方法：匹配成功，返回数组；否则返回null

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

//不用分组的写法
const reg = /<a href="(.*)">(.*)</\a>/

//提取url与标签文本,命名捕获分组  ?<名字>
const reg = /<a href="(?<url>.*)">(?<text>.*)<\/a>/

//执行
const result = reg.exec(str)
//reg.exec() 返回了一个数组，3个数据
    第一个数据：整个字符串
    第二个数据：第一个小括号的匹配到的数据
    第三个数据：第二个小括号的匹配到的数据
    
//提取捕获数据更加方便，命名后的数据会存储在groups
console.log(result.groups.url)
console.log(result.groups.text)

正则扩展-反向断言

1.正向断言

let str = 'QWER123456你哈哈777咳咳咳'

//  \d+ ：有1个或多个数字，?=：后面是咳并且前面是数字，匹配上就返回前面的数字内容
// 对咳咳咳这个标志进行区分

const reg = /\d+(?=咳)/
const result = reg.exec(str)

console.log(result) //777 

2.反向断言（我提取777）

数字前面是不是哈哈，如果是，那么就返回数字
const reg = /(?<=哈哈)\d+/

3.dotAll模式

. 元字符 除了换行以外的任意单个字符
let hd = "hdddd"
/hd*?/  ==> h
/hd+?/  ==? hd

? 禁止贪婪
+：取1个或多个，加了禁止贪婪？ 表示向少的取，也就是只取1个
*: 取0个或多个，加了禁止贪婪？ 表示向少的取，只取0个

这里 .*?<a> 表示只取第一个a标签
const reg = /<li>.*?<a>(.*?)<\/a>.*?<p>(.*?)<\/p>/gs;