码迷,mamicode.com
首页 > 其他好文 > 详细

promise初体验

时间:2018-06-17 19:49:57      阅读:164      评论:0      收藏:0      [点我收藏+]

标签:des   UNC   eve   ready   失败   node   jquery   AC   key   

window.jQuery = function(nodeOrSelector) {
    let nodes = {}
    nodes.addClass = function() {}
    nodes.html = function() {}
    return nodes
}

window.jQuery.ajax = function({url,method,body,headers}) {
    return new Promise(function(resolve,reject) {
            let request = new XMLHttpRequest()

            request.open(method, url) //配置request
            for(let key in headers) {
                let value = headers[key]
                request.setRequestHeader(key, value)
            }
            request.onreadystatechange = () => {
                if(request.readyState === 4) {
                    if(request.status >= 200 && request.status < 300) {
                        resolve.call(undefined, request.responseText)
                    } else if(request.status >= 400) {
                        reject.call(undefined, request)
                    }
                }
            }
            request.send(body)
        })
    }

window.$ = window.jQuery

mybutton.addEventListener(‘click‘, (e) => {
    window.jQuery.ajax({
        url: ‘/xxx‘,
        method: ‘get‘,
        headers: {
            name: ‘Rony‘
        }
    }).then(()=>{console.log(‘suc‘)},
        ()=>{console.log(‘fail‘)})
})

第一次接触promise,一点浅显的认知

这种写法的好处在于,先统一执行AJAX逻辑,不关心如何处理结果,然后,根据结果是成功还是失败,在将来的某个时候调用success函数或fail函数。

以上代码中,如果成功将执行resolve.call(undefined, request.responseText)

失败将执行reject.call(undefined, request)

这样执行代码和处理结果的代码就清晰的分开了

 

除此之外,promise还可以串行执行异步任务,比如需要先做任务1,如果成功后再做任务2,任何任务失败则不再继续并执行错误处理函数。

也可以并行执行异步任务,试想一个页面聊天系统,我们需要从两个不同的URL分别获得用户的个人信息和好友列表,这两个任务是可以并行执行的,用Promise.all()

这些将在后面继续学习

promise初体验

标签:des   UNC   eve   ready   失败   node   jquery   AC   key   

原文地址:https://www.cnblogs.com/ronyjay/p/9193466.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!