async await 就ajax因果调用解决方案（思路：以同步的思维解决异步的调用）

解释：async await 是es7中知识点，用babel可以进行转换

－为什么我们要这样做？－

例如，我们要一次调用多个ajax，但是我们知道的是不能保证顺序执行ajax。

聪明的朋友，会在一个ajax成功后再调用下一个ajax，但是如果我要调用多个n个ajax呢，那岂不是就是进入了回调地狱里了？！

因此，我们就用到了async await 以此顺序执行，即使你后一个ajax会用到上一个ajax回调后的参数，都不会影响！

ajax封装如下：

/**
     * @Ajax封装
     * 执行基本ajax请求,返回XMLHttpRequest
     *  $Ajax.request({
     *      url
     *      async 是否异步 true(默认)
     *      method 请求方式 POST or GET(默认)
     *      data 请求参数 (键值对字符串)
     *      success 请求成功后响应函数，参数为xhr
     *      error 请求失败后响应函数，参数为xhr 11
     *  });
     */
    let $Ajax = function() {
        let _onStateChange = (xhr, success, failure) => {
            if (xhr.readyState === 4) { //    请求已完成，且响应已就绪
                let _s = xhr.status; //   状态码
                if (_s >= 200 && _s < 300) {
                    success(xhr); //
                } else {
                    failure(xhr);
                }
            } else {}
        };
        let request = (opt) => {
            let _fn = () => {};
            let _url = opt.url || ''; //    获得url
            let _async = opt.async !== false,
                _method = opt.method || 'GET',
                _data = opt.data || null,
                _success = opt.success || _fn,
                _error = opt.failure || _fn;
            _method = _method.toUpperCase(); //  默认都转换大写
            if (_method === 'GET' && _data) {
                let _args = '';
                if (typeof _data === 'string') {
                    _args = _data;
                } else if (typeof _data === 'object') {
                    let _arr = new Array();
                    for (let _k in _data) {
                        let _v = _data[_k];
                        _arr.push(_k + '=' + _v);
                    }
                    _args = _arr.join('&');
                }
                _url += (_url.indexOf('?') === -1 ? '?' : '&') + _args;
                _data = null;
            }
            // var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveObject('Microsoft.XMLHTTP');
            let _xhr = window.XMLHttpRequest ? new XMLHttpRequest() : '';
            _xhr.onreadystatechange = () => { // 当请求被发送到服务器时，需要执行一些基于响应的任务
                _onStateChange(_xhr, _success, _error);
            };
            _xhr.open(_method, _url, _async); // 创建一个请求，并准备向服务器发送
            if (_method === 'POST') { //   如果是POST请求的时候，需要添加个请求消息头
                _xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded;');
            }
            _xhr.send(_data); //   向服务器发送请求
            return _xhr;
        };
        return {
            request: request
        };
    }();

async await 封装ajax如下：

function $myAjax(url, method, data, successed, failed) {
        let p = new Promise(function(resolve, reject) {
            $Ajax.request({
                url: url,
                method: method,
                data: data,
                success: function(resp) {
                    resolve(resp);
                    successed(resp);
                },
                failure: function(xhr) {
                    failed(xhr);
                    reject();
                }
            });
        });
        return p;
    }
    let $docs = document;
    $docs.getElementById('xxx').onclick = async function() {
        let resp1 = await $myAjax(url, 'get', { 'memberid': 1920744, 'activeid': 1 }, function(resp) {
            console.log(resp);
            console.log(2);
        }, function() {
            console.log('失败2');
        });
        let resp3 = await $myAjax(url, 'get', { 'memberid': 1920744, 'activeid': 1 }, function(resp) {
            console.log(resp);
            console.log(3);
        }, function() {
            console.log('失败3');
        });
    }