Если вы знакомы с программированием, вы уже знаете, какие действия выполняют функции и как их использовать. Это приводит нас к вопросу о том, что такое функция обратного вызова. Функции обратного вызова являются неотъемлемой частью JavaScript, и как только вы поймете, как работают обратные вызовы, вы станете намного лучше в JavaScript.
Итак, давайте разберемся, что такое функции обратного вызова и как их использовать в JavaScript.
Проще говоря, обратный вызов — это функция, которая должна быть выполнена после завершения выполнения другой функции — отсюда и название «обратный вызов».
Другими словами, в JavaScript функции — это объекты. Из-за этого функции могут принимать функции в качестве аргументов и могут быть возвращены другими функциями. Функции, которые делают это, называются функциями высшего порядка. Следовательно, функция обратного вызова — это функция, которая передается в качестве аргумента.
Обратный вызов, как следует из названия, — это функция, которая должна выполняться после завершения выполнения другой функции. Как известно, в JavaScript функции — это объекты. Из-за этого функции могут принимать функции в качестве аргументов, и другие функции также могут их возвращать. Функции, которые принимают дополнительную функцию в качестве параметра, называются функциями высшего порядка. Точно так же функция, которая передается в качестве аргумента, называется функцией обратного вызова.
Как видно из изображения выше, функция высокого порядка принимает функцию обратного вызова в качестве параметра. Кроме того, функция обратного вызова будет вызываться как последняя инструкция оператора высокого порядка. Что, в свою очередь, гарантирует, что обратный вызов всегда будет вызываться после того, как функция высшего порядка завершит свое выполнение.
Зачем и когда использовать функции обратного вызова в JavaScript?
Мы знаем, что в JavaScript большинство функций асинхронны. Иными словами, всякий раз, когда пользователь создает экземпляр функции, JavaScript не будет ждать ее ответа и продолжит выполнение следующих операторов, не дожидаясь завершения выполнения функции.
В JavaScript функции являются объектами. Более того, мы можем передавать объекты функциям в качестве параметров.
Кроме того, мы также можем передавать функции в качестве параметров другим функциям и вызывать их внутри внешних функций. Давайте поймем, что в примере ниже:
functionprint(callback){ callback(); }
Как показано в приведенном выше примере, функция print() принимает в качестве параметра другую функцию и вызывает ее внутри. Это допустимо в JavaScript, и мы называем это обратным вызовом. Другими словами, это функция, которая передается другой функции.
Зачем нужны функции обратного вызова?
JavaScript выполняет код последовательно сверху вниз. Однако бывают случаи, когда код запускается после того, как происходит что-то еще, и это тоже не последовательно. Это называется асинхронным программированием.
Обратные вызовы гарантируют, что функция не будет запущена до завершения задачи, а будет запущена сразу после ее завершения. Это позволяет нам разрабатывать асинхронный код JavaScript и избегать проблем и ошибок.
В JavaScript процедура создания функции обратного вызова состоит в том, чтобы передать ее в качестве параметра другой функции, а затем вызвать ее обратно сразу после того, как что-то произошло или какая-то задача была завершена.
Все мы знаем, что JavaScript — это язык, управляемый событиями. Это означает, что вместо того, чтобы ждать ответа, прежде чем двигаться дальше, JavaScript будет продолжать выполняться, ожидая других событий. Давайте рассмотрим базовый пример:
function first(){
console.log(1);
}function second(){
console.log(2);
}first();
second();
Как и следовало ожидать, функция first выполняется первой, а функция second выполняется второй.
Но что, если функция first содержит какой-то код, который не может быть выполнен немедленно. Например, в ситуации, когда запрос API, когда мы должны отправить запрос, затем дождаться ответа. Чтобы имитировать это действие, мы собирались использовать setTimeout, функцию JavaScript, которая вызывает функцию через заданное время. Мы задержим нашу функцию на 500 миллисекунд, чтобы имитировать запрос API.
Как создать обратный звонок?
Чтобы понять то, о чем мы говорили выше, давайте начнем с простого примера. Мы хотим записать сообщение в консоль, но оно должно появиться через 3 секунды.
constmessage=function(){console.log("This message is shown after 3 seconds"); } setTimeout(message,3000);
В JavaScript есть встроенный метод setTimeout. Этот метод вызывает функцию или оценивает выражение через заданный период времени (в миллисекундах). Итак, здесь функция «сообщение» вызывается по прошествии 3 секунд. (1 секунда = 1000 миллисекунд)
Другими словами, функция сообщения вызывается после того, как что-то произошло (в этом примере прошло 3 секунды), но не раньше. Таким образом, функция сообщения является примером функции обратного вызова.
Ключевые выводы:
Ниже приведены основные моменты, которые мы узнали в этой статье:
· Во-первых, когда вы хотите, чтобы одна функция выполнялась только после того, как другая функция завершила свое выполнение, мы используем функции обратного вызова в JavaScript.
· Его необходимо передать в качестве параметра другим функциям, чтобы сделать обратный вызов функции. Функция, которая принимает обратный вызов в качестве параметра, известна как «функция высокого порядка».
· Функции обратного вызова могут быть как «именованными», так и «анонимными».
· Ад обратного вызова возникает, когда у вас есть несколько функций обратного вызова, связанных друг с другом
· Функция JavaScript — это блок кода, который будет выполнен, когда вы его вызовете.
· Поскольку функции JavaScript являются объектами первого класса, вы можете передавать функции другим функциям как переменные.
· Метод передачи функций в качестве параметров другим функциям для использования их внутри используется в библиотеках JavaScript практически везде.
· Функции обратного вызова JavaScript могут использоваться синхронно или асинхронно.
