用promise封裝ajax

首先貼代碼

var ajaxOptions = {
    url: 'url',
    method: 'GET',
    async: true,
    data: null,
    dataType: 'text',
}

function ajax(protoOptions) {
    var options = {};

    for(var i in ajaxOptions){
        options[i] = protoOptions[i] || ajaxOptions[i];
    }
    

    return new Promise(function(resolve, reject){
        var xhr = new XMLHttpRequest();

        xhr.open(options.method, options.url, options.async);

        xhr.onreadystatechange = function() {
            if (this.readyState === 4 && this.status === 200) {
                resolve(this.responseText, this);
            } else {
                var resJson = {
                    code: this.status,
                    response: this.response
                }
                reject(resJson, this)
            }
        }

        xhr.send()

    })
}

注釋：

1，open(method, url, async) 

　　method:  GET和POST;

　　url: 發送到服務端的url;

　　async: 異步true，同步false;

2，onreadystatechange

　　每當readyState的值變化，onreadystatechange函數自動執行

3，readyState 服務器響應的狀態信息

　　

• 0: 請求未初始化
• 1: 服務器連接已建立
• 2: 請求已接收
• 3: 請求處理中
• 4: 請求已完成，且響應已就緒

　　當readyState的值為4，status狀態為200時表示相應已就緒，可以執行成功調用的方法,反之調用失敗調用的方法