Promise 对象是一个代理对象,它允许你为异步操作的成功和失败分别绑定相应的处理方法（handlers）。 这让异步方法可以像同步方法那样返回值，但并不是立即返回最终执行结果，而是一个能代表未来出现的结果的promise对象

一个 Promise有以下几种状态:

• pending: 初始状态，既不是成功，也不是失败状态。
• fulfilled: 意味着操作成功完成。
• rejected: 意味着操作失败。

参数

Promise 的构造器接收一个执行函数(executor)

executor是带有 resolve 和 reject 两个参数的函数 。Promise构造函数执行时立即调用executor 函数， resolve 和 reject 两个函数作为参数传递给executor（executor 函数在Promise构造函数返回所建promise实例对象前被调用）。resolve 和 reject 函数被调用时，分别将promise的状态改为fulfilled（完成）或rejected（失败）。executor 内部通常会执行一些异步操作，一旦异步操作执行完毕(可能成功/失败)，要么调用resolve函数来将promise状态改成fulfilled，要么调用reject 函数将promise的状态改为rejected。如果在executor函数中抛出一个错误，那么该promise 状态为rejected。executor函数的返回值被忽略。

属性

Promise.length

length属性，其值总是为 1 (构造器参数的数目)

Promise.prototype

表示 Promise 构造器的原型

基本使用

怎样拥有 Promise 功能

只需让该函数返回一个 Promise 就可以了

function sleep(time) {
    return new Promise(resolve => {
        console.log('executor 函数立即执行')
        setTimeout(resolve, time)
    })
}

console.log('1000 ms 之后醒来')
sleep(1000).then(() => { console.log('嗨起来！') })

当 executor 函数出异常的时候, Promise 状态改变成 rejected,executor函数的返回值被忽略

function sleep(time) {
    return new Promise(resolve => {
        throw 12
        // 这里将不会在执行
        setTimeout(resolve, time)
    })
}

sleep(1000).then(null, (e) => { console.log('error', e) })

链式调用

Promise.resolve 返回成功状态
Promise.reject 返回失败状态

// Promise.reject(1) 抛出了一个错误异常
// 会被最近的一个 onRejected 函数捕获到
Promise.reject(1).then((body) => {
    console.log('success', body)
    return Promise.reject(2)
}, null).then((body) => {
    console.log('success', body)
    return 3
}, (error) => {
    console.log('error', error)
    // 当返回值不是一个 Promise 对象的时候
    // 默认包装成 Promise 
    // 当 executor 没有出现异常的时候会走到下一个 onFulfilled 函数
    return 4
}).then((body) => {
    console.log('success', body)
    // 当 executor 没有出现异常的时候会走到下一个 onRejected 函数
    return a
}, (error) => {
    console.log('error', error)
}).then((body) => {
    console.log('success', body)
}, (error) => {
    console.log('error', error)
    // 当函数没有显示的设置返回值时
    // 默认返回一个 Promise 值为 undefined
}).then((body) => {
    console.log('success', typeof body)
}, (error) => {
    console.log('error', error)
})

Promise.all

并发操作 接收一个数组/string作为参数
当所有的结果成之后，才会走 onFulfilled ,否则走 onRejected

function sleep(time) {
    return new Promise(resolve => {
        console.log('executor 函数立即执行')
        setTimeout(resolve, time)
    })
}

Promise.all([sleep(100), Promise.resolve(1), 2]).then(body => {
    console.log('success', body) // success [undefined, 1, 2]
})

Promise.all([sleep(100), Promise.reject(1), 2]).then(body => {
    console.log('success', body) 
    console.log(body)
}, (error) => {
    console.log('error', error) // error 1
})

// 当参数为一个空是 是同步操作
Promise.all([]).then(body => {
    console.log('success', body) // success []
    console.log(body)
})

Promise.all('').then(body => {
    console.log('success', body) // success []
    console.log(body)
})

Promise.race

接收一个数组作为参数
最后的状态取决于数组中最快返回结果的某一项的状态

Promise.race([sleep(100), Promise.reject(1), 2]).then(body => {
    console.log('success', body) 
    console.log(body)
}, (error) => {
    console.log('error', error) // error 1
})

Promise.race([Promise.reject(1), 2]).then(body => {
    console.log('success', body) 
    console.log(body)
}, (error) => {
    console.log('error', error) // error 1
})

Promise.race([sleep(100), sleep(0)]).then(body => {
    console.log('success', body) // success 0
    console.log(body)
}, (error) => {
    console.log('error', error) 
})

Promise.prototype.finally(onFinally) 不管成功失败都会触发

Promise.resolve(1).finally(() => console.log('finally'))

Promise.reject(1).finally(() => console.log('finally'))

错误处理

链式调用时 只会找到最近的一个错误处理函数执行,即使监听了 catch 也不会触发

Promise.reject(1)
.then()
.then(null, error => console.log('错误处理 then', error))  // '错误处理 then' 1
.catch(error => console.log('错误处理 catch', error))  
.finally(() => console.log('finally')) // finally

缓存当前 Promise 示例的情况下 所有的错误处理函数都会触发

const p = Promise.reject(1)
p.then()
p.then(null, error => console.log('错误处理 then', error))  // '错误处理 then' 1
p.catch(error => console.log('错误处理 catch', error))  // '错误处理 catch' 1
p.finally(() => console.log('finally')) // finally

至此我们已经基本了解了 Promise 的使用了， 接下来让我们一起探讨一下 Promise 的原理

【笔记不易，如对您有帮助，请点赞，谢谢】