ES6之Promise

基本使用

/**
*  resolve
*/
function Person() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve('Hello World')
        },1000)
    })
}

Person().then(res => {
    console.log(res)   // 1秒后输出 Hello World (使用then)
})


/**
*  reject
*/
function Person() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            reject('Hello World')
        },1000)
    })
}

Person().catch(err => {
    console.log(err)   // 1秒后输出 Hello World (使用catch)
})


/**
* finally
*/
function Person() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve('Hello World')
        },1000)
    })
}

Person().then(res => {
    console.log(res)   // 1秒后输出 Hello World (使用then)
}).finally(() => {
    console.log('无论成功与否 我都会执行')
})

常见的几个API

• all 方法
  • 接收一个Promise数组，数组中如有非Promise项，则此项当做成功
  • 如果所有Promise都成功，则返回成功结果数组
  • 如果有一个Promise失败，则返回这个失败结果

// 如果全都为成功
function fn(time) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(`${time}毫秒后我成功啦！！！`)
        }, time)
    })
}

Promise.all([fn(2000), fn(3000), fn(1000)]).then(res => {
    // 3秒后输出 [ '2000毫秒后我成功啦！！！', '3000毫秒后我成功啦！！！', '1000毫秒后我成功啦！！！' ]
    console.log(res)
}, err => {
    console.log(err)
})


// 如果有一个失败
function fn(time, isResolve) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            isResolve ? resolve(`${time}毫秒后我成功啦！！！`) : reject(`${time}毫秒后我失败啦！！！`)
        }, time)
    })
}

Promise.all([fn(2000, true), fn(3000), fn(1000, true)]).then(res => {
    console.log(res)
}, err => {
    console.log(err) // 3秒后输出 '3000毫秒后我失败啦！！！'
})

• race 方法
  • 接收一个Promise数组，数组中如有非Promise项，则此项当做成功
  • 哪个Promise最快得到结果，就返回那个结果，无论成功失败

function fn(time, isResolve) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            isResolve ? resolve(`${time}毫秒后我成功啦！！！`) : reject(`${time}毫秒后我失败啦！！！`)
        }, time)
    })
}

Promise.race([fn(2000, true), fn(3000), fn(1000)]).then(res => {
    console.log(res)
}, err => {
    console.log(err) // 1秒后输出
})

• allSettled 方法
  • 接收一个Promise数组，数组中如有非Promise项，则此项当做成功
  • 把每一个Promise的结果，集合成数组，返回

function fn(time, isResolve) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            isResolve ? resolve(`${time}毫秒后我成功啦！！！`) : reject(`${time}毫秒后我失败啦！！！`)
        }, time)
    })
}

Promise.allSettled([fn(2000, true), fn(3000), fn(1000)]).then(res => {
    console.log(res)
    // 3秒后输出 
    [
        { status: 'fulfilled', value: '2000毫秒后我成功啦！！！' },
        { status: 'rejected', reason: '3000毫秒后我失败啦！！！' },
        { status: 'rejected', reason: '1000毫秒后我失败啦！！！' }
    ]
})

• any 方法
  • 接收一个Promise数组，数组中如有非Promise项，则此项当做成功
  • 如果有一个Promise成功，则返回这个成功结果
  • 如果所有Promise都失败，则报错

// 当有成功的时候，返回最快那个成功
function fn(time, isResolve) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            isResolve ? resolve(`${time}毫秒后我成功啦！！！`) : reject(`${time}毫秒后我失败啦！！！`)
        }, time)
    })
}

Promise.any([fn(2000, true), fn(3000), fn(1000, true)]).then(res => {
    console.log(res) // 1秒后 输出  1000毫秒后我成功啦
}, err => {
    console.log(err)
})


// 当全都失败时
function fn(time, isResolve) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            isResolve ? resolve(`${time}毫秒后我成功啦！！！`) : reject(`${time}毫秒后我失败啦！！！`)
        }, time)
    })
}

Promise.any([fn(2000), fn(3000), fn(1000)]).then(res => {
    console.log(res)
}, err => {
    console.log(err) // 3秒后 报错 all Error
})