使用promise封装jquery的ajax来实现async和await方式

promise是es6里用来解决回调地狱的方案,主要作用是让代码换了个书写形式,由异步形式换成可读性更好的“同步”形式。

使用jquery的ajax时,有时会遇到要在响应结果里做复杂操作的场景,这时候代码写起来就比较繁琐,可维护性不好,而如果使用es7的async、await方法就能大大提高代码质量,但是async和await也是要基于promise才能实现,所以就要对jquery的ajax做一个封装。

// 用promise对象封装
const jqPromiseAjax = params => {
    return new Promise((resolve, reject) => {
        $.ajax({
            url: params.url,
            type: params.type || 'get',
            dataType: 'json',
            headers: params.headers || {},
            data: params.data || {},
            success(res) {
                resolve(res)
            },
            error(err) {
                reject(err)
            }
        })
    })
}
// 再使用async和await
async function consoleLogUserInfo() {
    const data = await jqPromiseAjax({ 
        url: '/proxy/user/getUserInfo',
        type: 'get'
    }).then(res => res.data)
    console.log(data)
}
发布了13 篇原创文章 · 获赞 26 · 访问量 18万+

猜你喜欢

转载自blog.csdn.net/u010059669/article/details/88915844
今日推荐