• promise初体验


    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()

    这些将在后面继续学习

  • 相关阅读:
    CF932E Team Work(第二类斯特林数)
    BZOJ 3732: Network(Kruskal重构树)
    BZOJ 2753: [SCOI2012]滑雪与时间胶囊(最小生成树)
    BZOJ 2286: [Sdoi2011]消耗战(虚树+树形dp)
    hdu 4336 Card Collector(状压dp/Min-Max反演)
    BZOJ 3622: 已经没有什么好害怕的了(二项式反演)
    BZOJ 2839: 集合计数(二项式反演)
    CF gym 101933 K. King's Colors(二项式反演)
    BZOJ 1101: [POI2007]Zap(莫比乌斯反演)
    BZOJ 3747: [POI2015]Kinoman(线段树)
  • 原文地址:https://www.cnblogs.com/ronyjay/p/9193466.html
Copyright © 2020-2023  润新知