异步编程

回调函数

function loadImage(src, resolve, reject) {
    let image = new Image()
    image.src = src
    image.onload = resolve(image)
    image.onerror = reject
}
loadImage(
    'https://open.alrcly.com/avatar.jpg',
    iamge => { },
    () => { }
)

Promise

最大作用是可以封装其他方法，使其可以使用 .then 方式调用

new Promise((resolve, reject) => {
    resolve('Good')
    reject('NoNoNo')
}).then(
    value => { // 成功
        console.log(value)
    },
    reason => { // 拒绝
        console.log(reason)
    }
).catch(error =>{ // 错误
    console.log(eroor) 
}).finally(finally =>{ // 总是执行
    console.log(finally) 
})
// 直接返回成功/失败状态（前面的简写）
Promise.resolve() 
Promise.reject() 
// 同时处理多个 Promise 
Promise.all() 
Promise.allSettled()
// 多个 Promise 谁快处理谁
Promise.race()

Promise 队列

// 使用 map
function queue(num) {
    let promise = Promise.resolve()
    num.map(v => {
        promise = promise.then(() => {
            return v()
        })
    })
}
// 使用 reduce
function queue(num) {
    num.reduce((promise, n) => {
        return promise.then(() => {
            return n
        })
    }, Promise.resolve())
}

async 和 await

function num() {
    return new Promise(resolve => {
        setTimeout(() => resolve('nuew'), 1000)
    })
}
async function text() {
    const e = await num()
    console.log(e)
}
text()