如何複製jQuery ajax方法

Question

問題：我試圖複製jQuery ajax方法，因爲我在腳本中多次使用XMLHttpRequest。但是，我不認爲將jQuery作爲依賴項是必要的，因爲我只能使用jQuery庫中最多3個方法。爲此，我需要複製的jQuery的Ajax方法的一種好方法，到目前爲止，我這個地步得到，但請參閱下面的代碼示例輸出的解釋：

function ajax(obj) { 
    /* 
    obj = { 
     type: 'GET', 
     url: 'my/url/', 
     success: function (response) {}, 
     error: function (response) {}, 
     isTrue: true 
    } 
    */ 

    var 
     response = null, // defaults to null 
     complete = function (resp) { 
      console.log(resp); // outputs the response 
      response = resp; 
     }, 
     error = function (resp) { 
      response = resp; 
     }, 
     request = new XMLHttpRequest(); 

    request.open(obj.type || 'GET', obj.url, obj.isTrue || true); 

    request.onreadystatechange = function (e) { 
     if (request.readyState === 4) { 
      if (request.status >= 200 && request.status < 400) { 
       complete(request.responseText); 
      } else { 
       error(request.statusText); 
      } 
     } 
    } 

    request.send(); 

    return { 
     done: function (callback) { 
      callback(response); 
     } 
    } 
} 

後來，當我調用另一個函數的AJAX功能：

var xhr = ajax({ 
      url: 'js/routes.js', 
     }).done(function (resp) { 
      console.log(resp); // outputs 'null' 
     }); 

響應變量爲空雖然完整的（）函數設定的響應變量到AJAX .responseText的值。

問題：如何從請求到AJAX函數返回，這樣我可以在回調函數用它做什麼像我打算中，.done裏面做（對象返回.responseText的價值）該對象的方法？

謝謝！

Answer 1

您的實施出現錯誤。 '完成'功能不會等待響應。

function ajax(obj) { 
    /* 
     obj = { 
     type: 'GET', 
     url: 'my/url/', 
     success: function (response) {}, 
     error: function (response) {}, 
     isTrue: true 
     } 
     */ 

    var _callback = null, 
     response = null, // defaults to null 
     complete = function (resp) { 
      if(_callback){ 
       _callback(resp); 
      } 
      response = resp; 
     }, 
     error = function (resp) { 
      if(_callback){ 
       _callback(resp); 
      } 
      response = resp; 
     }, 
     request = new XMLHttpRequest(); 

    request.open(obj.type || 'GET', obj.url, obj.isTrue || true); 

    request.onreadystatechange = function (e) { 
     if (request.readyState === 4) { 
      if (request.status >= 200 && request.status < 400) { 
       complete(request.responseText); 
      } else { 
       error(request.statusText); 
      } 
     } 
    } 

    request.send(); 

    return { 
     done: function (callback) { 
      if(response){ 
       callback(response); 
      }else{ 
       _callback = callback; 
      } 

     } 
    } 
} 

編輯*

考慮使用microlibrary而不是jQuery的。不要重新發明輪子。 http://microjs.com/#ajax