首先，定義傳入 ajax函數(shù)的默認(rèn)參數(shù)

var ajaxOptions = {
   url: '#',                       url地址忠荞，默認(rèn)"#"
   method:  'GET',                 請(qǐng)求方法，僅支持GET,POST,默認(rèn)GET
   async: true,                    是否異步，默認(rèn)true
   timeout: 0                      請(qǐng)求時(shí)限拷窜，超時(shí)將在promise中調(diào)用reject函數(shù)
   data: null,                     發(fā)送的數(shù)據(jù)陌宿，該函數(shù)不支持處理數(shù)據(jù)，將會(huì)直接發(fā)送
   dataType: 'text',               接受的數(shù)據(jù)的類型忱屑，默認(rèn)為text
   headers: {}                     一個(gè)對(duì)象蹬敲，包含請(qǐng)求頭信息
   onprogress: function (){},      處理onprogress的函數(shù)
   ouploadprogress: function() {}, 處理.upload.onprogress的函數(shù)
   xhr: null                       允許在函數(shù)外部創(chuàng)建xhr對(duì)象傳入暇昂，但必須不能是使用過的
}

/**
 * ajax函數(shù)，返回一個(gè)promise對(duì)象
 * @return {Promise} 
 *   該函數(shù)注冊(cè)xhr.onloadend回調(diào)函數(shù)伴嗡，判斷xhr.status是否屬于 [200,300)&&304 急波，
 *   如果屬于則promise引發(fā)resolve狀態(tài)，允許拿到xhr對(duì)象
 *   如果不屬于瘪校，或已經(jīng)引發(fā)了ontimeout,onabort,則引發(fā)reject狀態(tài)澄暮，也允許拿到xhr對(duì)象
 */
function ajax(optionsOverride) {
    // 將傳入的參數(shù)與默認(rèn)設(shè)置合并
    var options = {};
    for (var k in ajaxOptions) {
        options[k] = optionsOverride[k] || ajaxOptions[k];
    }
    options.async = options.async === false ? false : true;
    var xhr = options.xhr = options.xhr || new XMLHttpRequest();

    return new Promise(function (resolve, reject) {
        xhr.open(options.method, options.url, options.async);
        xhr.timeout = options.timeout;

        //設(shè)置請(qǐng)求頭
        for (var k in options.headers) {
            xhr.setRuquestHeader(k, options.headers[k]);
        }

        // 注冊(cè)xhr對(duì)象事件
        xhr.onprogress = options.onprogress;
        xhr.upload.onprogress = options.onuploadprogress;
        xhr.responseType = options.dataType;

        xhr.onabort = function () {
            reject(new Error({
                errorType: 'abort_error',
                xhr: xhr
            }));
        }
        xhr.ontimeout = function () {
            reject({
                errorType: 'timeout_error',
                xhr: xhr
            });
        }
        xhr.onerror = function () {
            reject({
                errorType: 'onerror',
                xhr: xhr
            })
        }
        xhr.onloadend = function () {
            if ((xhr.status >= 200 && xhr.status < 300) || xhr.status === 304)
                resolve(xhr);
            else
                reject({
                    errorType: 'status_error',
                    xhr: xhr
                })
        }

        try {
            xhr.send(options.data);
        }
        catch (e) {
            reject({
                errorType: 'send_error',
                error: e
            });
        }
    })
}

使用方式如下：

ajax({
    url: 'http://localhost:8080/dy',
    async: true,
    onprogress: function (e) {
        console.log(e.position/e.total);
    },
    dataType:'text/json'
})
.then(function (xhr) { console.log(xhr.response.name); },
function (e) { console.log('失敗回調(diào)') })