JavaScript - это однопоточный язык, что означает, что вы можете запускать только один процесс за раз.
Но подождите, что, если какой-то процесс занимает слишком много времени для выполнения, например, кода, который делает запрос к серверу для получения таких данных.
let xhr = new XMLHttpRequest(); xhr.open(“GET”, “URL”, true); xhr.send();.
если JavaScript - однопоточный язык, он должен блокировать код и ждать ответа. Но это не тот случай, когда javascript не блокирует все выполнение кода, написанного после. Таким образом, возникает вопрос: какой трюк использует javascript для запуска этого кода.
Что такое функция обратного вызова?
Функции обратного вызова похожи на обычные функции в javascript, единственное, что отличает их от обычных функций, - это то, что они передаются в качестве аргумента функции.
function getData(filename,callback) { // file read code //after the file read is done callback function is called with or without argument which indicates that file read operation is done callback(‘data’); }
зачем нам функции обратного вызова?
Как обсуждалось при запуске, javascript является однопоточным языком, поэтому у него есть только один основной поток для выполнения операции, и если какой-то блок кода занимает слишком много времени для выполнения он заблокирует основной поток. в этом сценарии мы используем функции обратного вызова, которые передаются в качестве аргумента, и после завершения работы эта функция обратного вызова вызывается с необходимыми данными, которые являются параметром функции.
let xhr = new XMLHttpRequest(); xhr.open("GET", "URL", true); xhr.send(); xhr.addEventListener('load',function(){ if (this.status === 200 && this.readyStateChange === 4){ console.log(JSON.parse(xhr.responseText); } });
В этом коде мы передали прикрепленный прослушиватель событий к нашему HTTP-запросу, поэтому каждый раз, когда наш HTTP-запрос загружается, наша функция обратного вызова вызывается каждый раз, и код внутри функции обратного вызова запускается.
Как создать функцию обратного вызова?
Создать функции обратного вызова очень просто, вам просто нужно передать функцию в качестве аргумента другой функции и вызвать ее внутри этой функции с параметром или без него в соответствии с в соответствии с вашими потребностями.
Выполните следующие шаги, чтобы создать собственный обратный вызов.
Создайте функцию, которая принимает другую функцию в качестве аргумента
function add(a, b, callBack) { let ressult = a+b; callBack(result); }
Создайте функцию, которую вы можете передать указанной выше функции
Это похоже на любую другую обычную функцию javascript
function printResult(result) { console.log(result); }
Теперь вызовите функцию добавления с функцией результата печати в качестве аргумента
добавить (10, 20, printResult);
Вывод для приведенного выше кода будет