promise详细的适用

promise

promise的理解

promise对象创建自身带有一个函数,函数中有两个参数(resolve和reject),这两个参数可以控制promise状态;
promise状态默认是pending待定状态,promise中可以通过resolve状态修改成fulfilled 成功状态,通过reject将状态修改成rejected 失败状态。(promise中代码报错也会触发失败状态),但是promise的状态只能保持一个。
promise方法有两种 为then()和catch()方法,使用promise方法可以获取promise状态所返回的结果,then()接收的是promise对象成功状态下的结果,catch()接收的是失败状态下的结果。

用来解决回调地狱,所谓回调地狱就是指把函数作为参数层层嵌套请求,这样层层嵌套,
人们称之为回调地狱,代码阅读性非常差

promise.resolve的三种情况

1.resolve(‘普通数据’)

let p = new Promise((resolve, reject) => {
        resolve('123')
        resolve(aa)
    })
p.then(res => {
   console.log(res); // '123'
})

传的是啥数据输出的就是啥数据

2.resolve(promise对象)

let p = new Promise((resolve, reject) => {
        resolve(p1 )
    })
    let p1 = new Promise((resolve, reject) => {
        reject('456')
    })
    p.catch(err => {
        console.log(err); // 456
    })

传入promise对象时 则最终结果都是根据传入的那个promise对象来进行输出的 如以上就会输出456

3.resolve(thenable也就是then方法)

const aa = { then:function(resolve,reject){
        resolve(42)
    } }

    let p = new Promise((resolve, reject) => {
        resolve(p1)
    })
    p.then(res =>{
        console.log(res); //42
    })

跟方法二一样

promise.all

let p1 = new Promise((resolve, reject) => {
        // resolve('123')
        resolve('123')
    })
    let p2 = new Promise((resolve, reject) => {
        // resolve('123')
        resolve('456')
    })
    let p3 = new Promise((resolve, reject) => {
        // resolve('123')
        resolve('789')
    })
    Promise.all([p1,p2,p3]).then(res =>{
        console.log(res); // ['123','
        45','789]
    }).catch(err => {
        console.log(err);
    })

当这几个promise都成功则触发.then

你可能感兴趣的:(前端,javascript,vue.js)