Любимо на всички: време за концептуално видео! Обратните обаждания са важна концепция в JavaScript. Те са функции, които се извикват, когато дадено действие приключи. След това предоставете структура и време на нашия код.
Вземете например анимацията, която използвахме в последното видео. Изпълнението на анимациите отнема време. Ами ако искате нещо друго да се случи точно когато тази анимация приключи? Трябва ли да направите а setTimeoutсъс същата дължина като анимацията? Не. jQuery ни дава функции за обратно извикване, използвани само за тази цел.
Те обикновено са допълнителен параметър, който предаваме на метода. В случай на анимация, ние предаваме функция като последен параметър. Това е функцията за обратно извикване и ще бъде извикана, когато анимацията завърши.
$("#element").animate(( // stuff to animate ), function() ( // callback function ));Това изглежда малко фънки, но по същество просто правим:
.animate(a, b)Къде aе обект на свойства и стойности и bе функция за обратно извикване.
Но от последното видео знаем, че анимацията може да вземе и времеви параметър, който определя колко време ще отнеме анимацията. Къде отива това? Това е незадължителен параметър, точно както е функцията за обратно извикване. Ако искахме да го използваме, щяхме да го поставим точно в средата, така че по същество:
.animate(propertiesObject, duration, callback);Има и друг незадължителен параметър, низ, който можем да предадем, за да зададем облекчаваща стойност.
.animate(propertiesObject, duration, easing, callback);jQuery просто е страхотен и умен по отношение на тези незадължителни параметри. Ако оставите средните две и просто предадете обратното обаждане, той може да каже това, което предавате, е функция, а не номер или низ, така че знае, че имате предвид функция за обратно повикване. Не е нужно да предавате фалшиви стойности или нещо подобно. Това е просто добър дизайн на API!
Когато погледнете документацията за jQuery, те я показват по следния начин:
.animate (свойства (, продължителност) (, облекчаване) (, пълно))
След това веднага след обяснение на очакваните типове.
Но така или иначе, обратно към обратно извикване. Можете да получите доста вложени. Представете си, че поставяте друга анимация във функцията за обратно извикване и тази анимация има свой собствен обратен разговор. Това е напълно разумно, тъй като може да искате да направите многоетапна анимация. Просто трябва да останете организирани.
Вижте писалката 450c5810be27a9a8946cb8012cbd1213 от Chris Coyier (@chriscoyier) на CodePen
Тук просто използваме анимация като пример. Може би още по-често използване на функции за обратно извикване е Ajax. Ajax е, когато браузърът извика друг ресурс, без да опреснява страницата. Това може да отнеме напълно непознато време. Зависи от честотната лента и латентността и размера на файла и условията за грешки и всички видове неща. Вероятно не можете да направите нищо с тази заявка на Ajax, докато не получите нещо обратно или по друг начин повече информация. Функциите за обратно извикване са идеални за това и ще разгледаме това по-късно.