Введение в обратные вызовы в JavaScript для начинающих
Недавно я написал статью о функциях высшего порядка в JavaScript. Одним из аспектов функций высшего порядка является то, что вы можете передать функцию в качестве аргумента другой функции.
Что такое обратный вызов?
Когда мы передаем функцию в качестве аргумента другой функции, и эта функция вызывается внутри внешней или родительской функции, мы создаем обратный вызов. Если вы использовали встроенные методы в JavaScript, вероятно, вы уже использовали обратный вызов. Давайте рассмотрим базовый пример.
function greet(cbFunc) { cbFunc(); cbFunc(); } function sayHello() { console.log("Hello"); } greet(sayHello); //Returns ---> 'Hello' 'Hello'
В приведенном выше примере мы создаем объявление функции с именем greet, которое принимает параметр cbFunc. Внутри тела функции cbFunc вызывается дважды. Затем мы создаем еще одно объявление функции с именем sayHello, и внутри тела этой функции мы записываем в console.log Hello. Это будет наша функция обратного вызова. Затем мы вызываем функцию greet и передаем sayHello в качестве аргумента, чтобы она стала функцией обратного вызова.
Когда мы используем функции обратного вызова, мы часто используем анонимную функцию, а не существующую. Причина этого в том, что если функция обратного вызова не будет использоваться где-либо еще, то нет необходимости хранить именованную функцию в коде для обратного вызова. В следующем примере мы обновляем код для использования анонимной функции:
function greet(cbFunc) { cbFunc() cbFunc() } greet(function() { console.log("Hello"); }) //Returns ---> 'Hello' 'Hello'
Мы объявляем объявление функции с именем приветствие, которое принимает параметр с именем cbFunc. Это будет функция обратного вызова, и она дважды вызывается внутри тела функции. Затем мы вызываем функцию greet и передаем анонимную функцию непосредственно в качестве аргумента. Мы получаем тот же результат, когда функция запускается.
Если вы использовали setTimeout в JavaScript, значит, вы уже использовали обратный вызов. Функция setTimeout принимает обратный вызов и выполняет его по истечении определенного периода времени. Давайте посмотрим на пример.
setTimeout(() => {
console.log("Hello");
}, 1000);
//Returns ---> 'Hello'
В приведенном выше примере мы передаем анонимную функцию в качестве обратного вызова setTimeout. Обратный вызов возвращает журнал консоли, в котором печатается строка Hello. Через одну секунду это печатается на экране.
Надеюсь, вам понравилась эта статья. Пожалуйста, не стесняйтесь публиковать любые комментарии, вопросы или отзывы и подписывайтесь на меня, чтобы получать больше контента!
Дополнительные материалы на PlainEnglish.io. Подпишитесь на нашу бесплатную еженедельную рассылку новостей. Подпишитесь на нас в Twitter и LinkedIn. Посетите наш Community Discord и присоединитесь к нашему Коллективу талантов.