用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時表示相應已就緒，可以執行成功調用的方法,反之調用失敗調用的方法.

對前端的技術，架構技術感興趣的同學關注我的頭條號，並在後臺私信發送關鍵字：“前端”即可獲取免費的架構師學習資料

知識體系已整理好，歡迎免費領取。還有面試視頻分享可以免費獲取。關注我，可以獲得沒有 的架構經驗哦！！

閱讀更多 前端攻城小牛 的文章

關鍵字: 服務端 技術