promise 是什么?有哪些状态和参数?如何使用?

什么是同步,什么是异步

既然要说Promise,那么就要先介绍一下什么是同步,什么是异步,javascript中执行代码的顺序是从上到下,依次进行执行,这就是同步。
而异步则是在同步执行完毕之后,在执行异步代码,比如说常见的异步有定时器,ajax。

什么是Promise?

Promise是Es6新增语法,用来解决异步问题,将异步代码同步化,解决接口套接口的地狱回调问题。

promise的基本语法
 var p = new Promise(function(resolve,reject){
            if("异步请求成功"){
                resolve('成功的结果')
            }else{
                reject('失败的信息')
            }
        });

        p.then(
            function(res1){
                console.log(res1)    //promise的第一个then 中的第一个函数用来处理 resolve  
            },
            // function(res2){              
            //     console.log(res2)  // then的第二个函数也可以用来 接收reject的返回值
            // }

        ).catch(function(error){
            // 捕获错误 
            if(error){
                console.log(error);
            }
        }).
        then(function(er){        // 第二个then是第一个then结束后的回调函数
           // 第一个then 处理结束后的回调函数
           console.log('处理完成');
        })

语法总结

  • 1、promise 的参数是一个回调函数,回调函数中有两个 参数人别是resolve, reject resolve 用来返回异步请求成功的结果 reject 用来返回异步请求失败的结果
  • 2、promise 的对象将异步请求结果保存后,需要使用第一个 .then来获取结果resolve函数返回的结果 .catch 获取reject 返回的结果。当然,我们也可以在 第一个.then中的第二个 回调函数获得 reject 返回的结果(上述问题可以查看代码~ 我写注释了)
  • 3、promise 还可意识用 第二个.then是第一个.then的回调函数,这里可以继续处理其他逻辑(个人感觉有些 马后炮的意思,所以不经常使用,出现的概率也比较低)
prmise.all的用法
   var p1 = new Promise(function(resolve,reject){
                setTimeout(function(){
                    resolve('p1完成')
                },1000)
            })
            var p2 = new Promise(function(resolve,reject){
                setTimeout(function(){
                    resolve('p2完成')
                },2000)
            })
            var p3 = new Promise(function(resolve,reject){
                setTimeout(function(){
                    resolve('p3完成')
                },3000)
            })

            Promise.all([p3,p2,p1]).then(function(res){
                console.log(res)  
                // p3,p2,p1是我调用的顺序  ["p3完成", "p2完成", "p1完成"]是我返回的结果
                // 可以看得出来,我们控制了 3个异步请求的返回顺序

            })

总结:promise.all 的使用场景就是,可以同时处理多个异步请求,并控制他们返回的【结果的顺序】
注意:promise.all中的 任何一个请求失败,将不会有返回结果。

prmise.race的用法
            var p1 = new Promise(function (resolve, reject) {
                setTimeout(function(){
                  resolve('p1');  
                },1000)
                
            }) ;   
            var p2 = new Promise(function (resolve, reject) {
                setTimeout(function(){
                  resolve('p2');  
                },30)
            })
            Promise.race([p1, p2]).then(function (data) {
                console.log(data);  // 'p2'   这里只返回一个执行最快的结果
            })
promise 结合 await async 封装接口api(只是一个简单的,没有任何判断)
function http(url, type, data = '') {
    let p = new Promise((resolve, reject) => {
        if (token) {
            $.ajax({
                url,
                type,
                data,
                success: (res) => {
                    resolve(res)
                },
                error: (er) => {
                    reject(er)
                }
            })
        }

    })
    return p
}

function getList(n,status,nickname,mobel) {
   return http(`http://120.xx.xx.103:84/api/user?page=${n}&limit=10&status=${status}&nickname=${nickname}&mobile=${mobel}&`, 'get')
}
// 调用
async function List(n, status, nickname, mobel) {  
    var list = await getList(n, status, nickname, mobel)  
    //  这个将 异步的接口封装,同步化
    console.log(list); // 这里以同步的方式 获得异步结果
 }  


你可能感兴趣的:(promise 是什么?有哪些状态和参数?如何使用?)