Повторное использование метода JavaScript

Question

У меня есть два метода, которые в значительной степени делают то же самое. Я хотел бы улучшить это, просто повторно используя другой метод, что-то вроде переопределения метода в объектно-ориентированном программировании.

Метод 1 Резюме: На основе level, сделать post запрос на сервлет, который возвращает все курсы для данного уровня в формате JSON (response). Затем загрузите эти курсы в поле со списком ($loadTo). После этого предварительно выберите course и покажите некоторые модальные.

function loadCoursesByLevelThenSet(level, course, $loadTo) { 
    $.post(... , ... , 
    function(response) { 

     var options = '<option value="">Please select course...</option>'; 
     for (var i = 0; i < response.length; i++) { 
      ... 
     } 

     $loadTo.html(options); 

     $loadTo.val(course); 
     $('#modal').modal('show'); 

    }).fail(function() { 

     alert('Something went wrong while loading options for courses. Please try again.'); 

    }); 
} 

Метод 2 Резюме: На основе level, сделать post запрос на сервлет, который возвращает все курсы для конкретного level в формате JSON (response), а затем загрузить эти курсы в поле со списком ($loadTo).

function loadCoursesByLevel(level, $loadTo) { 
    $.post(... , ... , 
    function(response) { 

     var options = '<option value="">Please select course...</option>'; 
     for (var i = 0; i < response.length; i++) { 
      ... 
     } 

     $loadTo.html(options); 

    }).fail(function() { 

     alert('Something went wrong while loading options for courses. Please try again.'); 

    }); 
} 

Это то, что я придумал, но он не работает правильно:

function loadCoursesByLevelThenSet(level, course, $loadTo) { 
    if (loadCoursesByLevel(level, $loadTo) === true) { 

     //after the courses are fully loaded 
     //select a course 
     //and show the modal 

     $loadTo.val(course); 
     $('#modal').modal('show'); 
    } 
} 

function loadCoursesByLevel(level, $loadTo) { 
    $.post(... , ... , 
    function(response) { 

     var options = '<option value="">Please select course...</option>'; 
     for (var i = 0; i < response.length; i++) { 
      ... 
     } 

     $loadTo.html(options); 

    }).fail(function() { 

     alert('Something went wrong while loading options for courses. Please try again.'); 

    }).done(function() {   

     return true; 

    }); 
} 

Что я делаю неправильно? Есть ли способ достичь этого? Спасибо.

Answer 1

Проблема с попыткой решения - вы не можете вернуть значение, потому что ajax является асинхронным.

Вы можете передать обратный вызов loadCoursesByLevel() и запустить его после запуска своего собственного кода успеха. Проверяя, является ли обратный вызов неопределенным, вы можете сделать его необязательным для большей гибкости.

function loadCoursesByLevel(level, $loadTo, callback) { 
    $.post(... , ... , 
    function(response) { 
     var options = '<option value="">Please select course...</option>'; 
     for (var i = 0; i < response.length; i++) { 
      options += '<option value="' 
        + response[i].code + '">' 
        + response[i].course + '</option>'; 
     } 
     $loadTo.html(options); 

     if(typeof callback != 'undefined'){ 
      callback(); // <------------- execute callback 
     } 
    }).fail(function() { 
     alert('Something went wrong while loading options for courses. Please try again.'); 
    }); 
} 

function loadCoursesByLevelThenSet(level, course, $loadTo) { 
    loadCoursesByLevel(level, $loadTo, function() { 
     $loadTo.val(course); 
     $('#modal').modal('show'); 
    }); 
}