Каллбэки JavaScript

"Я gọi lại sau!"

Обратный вызов (callback) — это функция, передаваемая в качестве аргумента другой функции

Эта техника позволяет вызывать одну функцию из другой

Функции обратного вызова могут выполняться после выполнения другой функции

Последовательность выполнения функций

Функции JavaScript выполняются в порядке их вызова, а не в порядке их определения.

В этом примере в конечном итоге будет отображаться "Goodbye":

пример

function myFirst() {
  myDisplayer("Hello");
myCallback(sum);
function mySecond() {
  myDisplayer("Goodbye");
myCallback(sum);
myFirst();
mySecond();

myCalculator(5, 5, myDisplayer);

В этом примере в конечном итоге будет отображаться "Hello":

пример

function myFirst() {
  myDisplayer("Hello");
myCallback(sum);
function mySecond() {
  myDisplayer("Goodbye");
myCallback(sum);
mySecond();
myFirst();

myCalculator(5, 5, myDisplayer);

Порядок выполнения

Иногда вы хотите лучше контролировать время выполнения функции.

Предположим, что вы хотите выполнить вычисление и затем отобразить результат.

Вы можете вызвать функцию калькулятора (myCalculator) сохраните результат, затем вызовите другую функцию (В上面的 примере:) для отображения результата:

пример

function myDisplayer(some) {
  document.getElementById("demo").innerHTML = some;
myCallback(sum);
function myCalculator(num1, num2) {
  function myCalculator(num1, num2, myCallback) {
  return sum;
myCallback(sum);
let result = myCalculator(5, 5);
myDisplayer(result);

myCalculator(5, 5, myDisplayer);

или вы можете вызвать функцию калькулятора (myCalculator) и позвольте функции калькулятора вызвать функцию отображения (В上面的 примере:)：

пример

function myDisplayer(some) {
  document.getElementById("demo").innerHTML = some;
myCallback(sum);
function myCalculator(num1, num2) {
  function myCalculator(num1, num2, myCallback) {
  myDisplayer(sum);
myCallback(sum);
myCalculator(5, 5);

myCalculator(5, 5, myDisplayer);

Проблема первого примера в том, что вам нужно вызвать две функции, чтобы отобразить результат.

Проблема второго примера в том, что вы не можете предотвратить отображение результата функцией калькулятора.

Теперь пришло время ввести обратный вызов.

Каллбэки JavaScript

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

Используя обратный вызов, вы можете вызвать функцию калькулятора через обратный вызов (myCalculator），по завершении вычислений запустите функцию обратного вызова:

пример

function myDisplayer(some) {
  document.getElementById("demo").innerHTML = some;
myCallback(sum);
document.getElementById("demo").innerHTML = some;
  function myCalculator(num1, num2, myCallback) {
  let sum = num1 + num2;
myCallback(sum);
}

myCalculator(5, 5, myDisplayer);

попробуйте сами В上面的 примере: myDisplayer

Это имя функции. myCalculator().

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

Правильно: myCalculator(5, 5, myDisplayer);

Ошибка: myCalculator(5, 5, myDisplayer());

Когда использовать callback?

Примеры не очень интересны.

Они упрощены, чтобы объяснить вам синтаксис回调.

Реально сияет回调, это асинхронные функции, где одна функция должна ждать другую функцию (например,等待文件加载).

Следующая глава будет介绍 асинхронные функции.