2009-03-10 5 views
2

이 자바 스크립트 코드를 리팩터링하는 데 도움을주세요. 예약 된 메시지 전송을위한 큰 형식이 있습니다 (날짜, 응답 유형, 날짜 별/수량 단위, 크레딧 시스템 - 런타임에 예약 된 전송 계획의 총 비용 계산 필요). 이 양식에 자바 스크립트 검사기를 쓰고 있습니다.중첩 된 AJAX 콜백 함수의 가독성

검사 알고리즘 1) 보낼 날짜 시간이 지난 순간 이 아닌 경우 확인) "날짜 종료"있는지 확인 필드 시간 후 큰이 첫 번째 전송 날짜 시간 3) 일정 계획의 총 비용을 확인

(이 약 6 단계,하지만 난 그냥 여기 3 중 쓰기 - 나는 문제를 파악하기에 충분 생각)

을 "스케줄 계획을 저장"버튼을 "클릭"이벤트에 자바 스크립트 리스너를 가지고있다. 여기

ScheduledValidator.checkIfSendDateTimeIsNotInPast(params, form); 

그것의 선언입니다 : 우리는 요청 나중에 중첩 된

ScheduledValidator.checkIfSendDateTimeIsNotInPast = function (params, form) { 
    var conn = new Ext.data.Connection(); 

    conn.request({ 
     url: CONST.BASE_URL + 'url', 
     params: params, 
     callback: function (options, success, response) { 
      response = Ext.util.JSON.decode(response.responseText); 
      if (response.success == false) { 
       // display error messages 
      } else { 
       ScheduledValidator.checkIfEndDateIsGreaterThatSendDate(params, form); 
      } 
     } 
    }); 
} 

:

ScheduledValidator.checkIfEndDateIsGreaterThatSendDate = function (params, form) { 
var conn = new Ext.data.Connection(); 

conn.request({ 
    url: CONST.BASE_URL + 'url2', 
    params: params, 
    messageForm: form, 
    callback: function (options, success, response) { 
     response = Ext.util.JSON.decode(response.responseText); 
     if (response.success == false) { 
      // display error messages 
     } else { 
      ScheduledValidator.validateTotalCost(params, form); 
     } 
    } 
}); 
} 

여기에 하나 더 :

ScheduledValidator.validateTotalCost = function (params, form) { 
... 
이 청취자는,이 함수를 호출

나는 t를 좋아하지 않아. 처음에는 알고리즘을 이해하기가 매우 어렵다는 것을 알게되었다. 단일 폼의 유효성 검사를 위해 여러 (약 6) 중첩 된 AJAX 쿼리를 만드는 것이 좋지 않을 수 있습니다. 아마도 단일 요청에 병합되어야하며 그 후에는 서버 측에서 모든 유효성 검사 작업을 수행합니까? 이 코드를 어떻게 리팩터링해야합니까?

답변

2

코드를 리팩토링하기 전에 양식 프로세스 및 사용자 환경이 어떻게 작동하는지 평가하고 평가하는 것이 좋습니다.

예를 들어, 날짜를 입력 할 때 즉시 사용자에게 피드백을 제공해야합니까? 그녀가 양식 작성을 마칠 때까지 기다릴 수 있습니까? 그렇다면 일반 양식 게시를 사용하고 제출 서버 측의 유효성을 검사 한 다음 피드백을 반환 할 수 있습니다.

그렇지 않은 경우 즉각적인 피드백이 필요한 경우 양식 유효성 검사를 처리하기 위해 구현과 관련된 일반 래퍼를 만드는 것이 좋습니다. 이는 수동으로 수행 할 수도 있고, 필요에 따라 특정 URL 및 콜백을 정의 할 수있는 양식 검증 메커니즘을 Google에서 둘러 볼 수도 있습니다.

세 번째 옵션은 서버에 문의하지 않고 클라이언트 쪽에서 유효성 검사를 수행하는 것일 수 있습니다. 당신의 논리가 자바 스크립트로 수행 될 수 있는지 결정하십시오. (아마도 날짜 계산을 포함한다면 너무 어렵지 않을 것입니다.) 그렇게하는 레이어를 추가하려고합니다. 그래서 당신은 당신의 서버에 접속할 필요가 없습니다. 처음. 보너스 : 서버 측 코드가 응답하는 속도에 따라 실제로는 사용자 경험이 향상 될 수 있습니다 (단, 서버 측 유효성 검사는 필수 사항입니다).

당신이 질문에 제시 한 예제 사용 사례에서 이전 제안이 적용되는 것처럼 들립니다. 즉, 양식이 올바르게 채워지는지에 대한 귀하의 의견에 즉각적으로 응할 필요는 없습니다. 귀하의 상황에 대한 나의 이해가 정확하다면 AJAX 호출을 제거하고 정상적인 형태로 작동하도록 리팩터링 프로세스를 시작한 다음 클라이언트 측 유효성 검사를 추가하면됩니다.