1

Колбэки в js так или иначе перекликаются со слушателями событий. Пример моей реализации слушателя:

document.addEventListener("DOMContentLoaded", pageLoadedHandler);

function pageLoadedHandler() {
  console.log('завершена загрузка и построение DOM документа');
}

В этом примере мне понятно что только по достижению события: DOMContentLoaded, вызовется функция pageLoadedHandler

Но есть другой пример с функцией колбэком: Существует 2 функции: func1, func2

func1 должна быть вызвана только по достижению события из функции func2

func1 в данном случае является функцией обратного вызова или колбэком.

Используя иструмент языка: колбэки, нужно func1 передать как аргумент функции 2.

let some_var = "dobrih vecherov";

function func1(a) {
  //do something with a
}

function func2(my_callback, b) {
  //some code here

  //ajax request must return response,
  //but you need to wait a bit until a response from the server arrives

  //some condition for callback function
  if (request.readyState == 4 && request.status == 200) {
    my_callback(b);
  }
  
}

func2(func1, some_var);

Если колбэк вешается на событие, то с таким же успехом я могу запустить функцию func1 по событию:

function func1(a) {
  //do something with a
}

function func2(b) {
  //some code here

  //ajax request must return response,
  //but you need to wait a bit until a response from the server arrives

  //some condition for func1
  if (request.readyState == 4 && request.status == 200) {
    func1(b);
  }

}

func2(some_var);

Результат выполнения обоих сценариев на вид одинаков: func1 вызвана только по достижению события из функции func2

Вопрос: зачем тогда колбэки нужны, если я и так могу функцию по событию запустить? Можете привести пример, где четко понятно в сравнении как в моем примере, почему нужно использовать именно callback.

1
  • 1
    Вызывая func1 внутри func2, Вы тем самым лишаете возможности вызвать какой-нибудь func3 вместо func1, если в этом возникла бы необходимость. function func3(a) { //do something other with a }
    – Sergey
    12 сен 2021 в 6:48

1 ответ 1

4

Пример вы уже сами привели в самом начале. Почему метод addEventListener не может запустить функцию pageLoadedHandler без явной передачи её в аргументе? Потому что он универсальный, и не знает о ней. И не знает, что именно её нужно запускать, а не сотни других.

Так же и в собственном методе может быть подобная ситуация. Напишите сами аналог метода addEventListener. Сразу станет понятно, что внутри него вы не знаете какую именно функцию вызывать, но знаете, что нужно что-то вызвать. Поэтому требуется аргумент-колбэк. Или какой-то другой способ доставки какой-то функции внутрь другой функции.

Если вы можете вызвать функцию сразу, и всякая универсальность не требуется, то и колбэк не нужен.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.