Использовать ".then" из JqueryAJAX для "нормальной" функции?

Question

Ситуация выглядит следующим образом:

$("#someThing").datepicker({
  //someOptions,
  onSelect: function() {
    /*Does some async stuff*/
    AJAXCALL();
    /*execute AFTER ajaxcall has finished*/
    foo();
  }
})


function AJAXCALL() {
  $.post('someUrl.php', {
    //nothing to transmit
  }, someFunction(data))
}

Дело в том, что приводит к каскаду функций, которые обрабатывают DataFromTheDatabase. Код внутри этого каскада либо синхронный, либо внутри есть секции async / await, которые правильно синхронизируют код.

В конечном итоге, и начальная AJAXCALL(), и последующие функции ДОЛЖНЫ завершиться до выполнения foo().

Было бы достаточно сделать следующее:

$("#someThing").datepicker({
  //someOptions,
  onSelect: function() {
    AJAXCALL().then(() => {
      foo()
    })
  }
})


function AJAXCALL() {
  return $.post('someUrl.php', {
    //nothing to transmit
  }).then((data) => someFunction(data))
}

Answer 1

С текущей версией jQuery уже достаточно написать ее, как вы делали во втором примере:

$("#someThing").datepicker({
  //someOptions,
  onSelect: function() {
    AJAXCALL().then(() => {
      foo()
    })
  }
})


function AJAXCALL() {
  return $.post('someUrl.php', {
    //nothing to transmit
  }).then((data) => someFunction(data))
}

Итак, someFunction будет вызван до вызова foo.

И вам не нужно писать .then((data) => someFunction(data)), вместо этого вы можете просто написать .then(someFunction). То же самое с foo:

$("#someThing").datepicker({
  //someOptions,
  onSelect: function() {
    AJAXCALL().then(foo)
  }
})


function AJAXCALL() {
  return $.post('someUrl.php', {
    //nothing to transmit
  }).then(someFunction)
}

Answer 2

Используйте тогда, когда https://api.jquery.com/jquery.when/

$("#someThing").datepicker({
  //someOptions,
  onSelect: function() {
    $.when( AJAXCALL() ).then(() => {
      foo()
    })
  }
})


function AJAXCALL() {
  return $.post('someUrl.php', {
    //nothing to transmit
  }).then((data) => someFunction(data));
}