Есть ли способ сохранить функцию / вызов ajax, чтобы его можно было повторно использовать?

Question

Я работаю над веб-приложением, использующим JavaScript и PHP, и снова и снова перекодирую одни и те же вызовы ajax. Есть ли способ сохранить его как функцию, с параметрами или без параметров, или даже как переменную, которую можно использовать позже?

Примечание: я все еще изучаю JavaScript на ходу, поэтому я ценю любую терпимость к своему невежеству.

Например, вместо этого:

  $("body").on("click", ".all-forms-link", function() {
         $.ajax({ 
            url: "forms.php", 
            type: "post", 
            data: {formsPage: 1}, 
            success: function(data) {
                     stage.html(data)
             }

          }); 
     }); 
     //called several more times on different actions

Примерно так:

      function loadForms() {
            $.ajax({ 
            url: "forms.php", 
            type: "post", 
            data: {formsPage: 1}, 
            success: function(data) {
                     stage.html(data)
                                     }
                   }); 
                             }

  body.on("click", ".all-forms-link", function() {
        loadForms(); //or something similar
   }); 

Answer 1

Конечно. При создании объявления именованной функции, например:

function foo(){
   . . .
}

Вы можете ссылаться на эту функцию по имени, где бы она ни ожидалась.

Итак, ваш код может быть даже проще, чем то, что вы показали:

function loadForms() {
  console.log("AJAX Call Initiated!");
  $.ajax({ 
    url: "forms.php", 
    type: "post", 
    data: {formsPage: 1}, 
    success: function(data) {
      stage.html(data)
    }
  }); 
}

// Just refer to your function's name (don't add parenthesis after 
// the name though because we don't want to execute it with this line
// we only want to refer to it) where a function is expected.
$(document).on("click", ".all-forms-link", loadForms);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="all-forms-link">Click me</div>