Invoke 콜백 메소드

Question

Todd Motto의 Atomic.JS (http://toddmotto.com/writing-a-standalone-ajax-xhr-javascript-micro-library/)에 느슨하게 적용된 멋진 AJAX 인터페이스를 만들려고합니다. 그러나 나의 적응은 효과가 없다. 문제 : 그와 같은 함수를 사용할 때

ajax.post(url, data) 
    .success(function(x) { 
     console.log('success',x); 
    }) 
    .error(function(x) { 
     console.log('error',x); 
    }); 

AJAX 함수는 오류 메서드에 '도달'할 수 없지만 성공은 완벽하게 동작합니다. 오류 함수를 호출 할 때 오류 함수를 작성할 때 완벽하게 작동합니다. 예 : 과 같이 :

ajax.post(url, data) 
    .error(function(x) { 
     console.log('error', x); 
    }); 

가 여기 내 AJAX 방식

var ajax = (function() { 

    var parse = function(req) { 
     var result; 
     try { 
      result = JSON.parse(req.responseText); 
     } catch (e) { 
      result = req.responseText; 
     } 
     return [result, req]; 
    }; 

    var xhr = function(type, url, data) { 
     var methods = { 
      success: function() {}, 
      error: function() {} 
     }; 
     var XHR = XMLHttpRequest || ActiveXObject; 
     var request = new XHR('MSXML2.XMLHTTP.3.0'); 
     request.open(type, url, true); 
     request.setRequestHeader("X-CSRFToken", getCookie('csrftoken')); 
     request.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); 
     request.onreadystatechange = function() { 
      if (request.readyState === 4) { 
       if (request.status === 200) { 
        methods.success.apply(methods, parse(request)); 
       } else { 
        methods.error.apply(methods, parse(request)); 
       } 
      } 
     }; 
     request.send(data); 
     return { 
      success: function(callback) { 
       methods.success = callback; 
       return methods; 
      }, 
      error: function(callback) { 
       methods.error = callback; 
       return methods; 
      } 
     }; 
    }; 

    return { 
     get: function(url) { 
      return xhr('GET', url); 
     }, 
     post: function(url, data) { 
      return xhr('POST', url, data); 
     } 
    }; 

})(); 

의 I 토드 모토 내가 익숙하지 않다 팩토리 메소드를 사용하는 것을 알 수있다. 내 .error에 도달하도록 도와주세요!

Answer 1

글쎄, 문제는 success 함수를 실행할 때 성공 콜백 만 설정한다는 것입니다. 오류 콜백은 빈 자리 표시 자 함수로 덮어 씁니다. 따라서 객체의 error 함수를 실행하여 error 콜백을 설정할 때 원하는 함수를 호출하지 않고 빈 함수를 호출합니다.

var ajax = (function() { 

    var parse = function(req) { 
     var result; 
     try { 
      result = JSON.parse(req.responseText); 
     } catch (e) { 
      result = req.responseText; 
     } 
     return [result, req]; 
    }; 

    var xhr = function(type, url, data) { 
     var methods = { 
      success: function(callback) { 
       this.success = callback; 
       return this; 
      }, 
      error: function(callback) { 
       this.error = callback; 
       return this; 
      } 
     }; 
     var XHR = XMLHttpRequest || ActiveXObject; 
     var request = new XHR('MSXML2.XMLHTTP.3.0'); 
     request.open(type, url, true); 
     request.setRequestHeader("X-CSRFToken", getCookie('csrftoken')); 
     request.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); 
     request.onreadystatechange = function() { 
      if (request.readyState === 4) { 
       if (request.status === 200) { 
        methods.success.apply(methods, parse(request)); 
       } else { 
        methods.error.apply(methods, parse(request)); 
       } 
      } 
     }; 
     request.send(data); 
     return methods; 
    }; 

    return { 
     get: function(url) { 
      return xhr('GET', url); 
     }, 
     post: function(url, data) { 
      return xhr('POST', url, data); 
     } 
    }; 

})();