Mindenki kedvence: koncepciós videóidő! A visszahívások fontos fogalmak a JavaScript-ben. Ezek olyan függvények, amelyeket akkor hívunk meg, amikor egy művelet befejeződött. Ezután adjon struktúrát és időzítést a kódunknak.
Vegyük például az animációt, amelyet az utolsó videóban használtunk. Az animációk futtatásához idő kell. Mi van, ha azt szeretné, hogy valami más történjen, amikor az animáció befejeződik? Van, hogy nem egy setTimeoutazonos hosszúságú animációs? Dehogy. A jQuery visszahívási funkciókat ad nekünk, amelyeket csak erre a célra használnak.
Jellemzően egy további paraméter, amelyet átadunk a módszernek. Animáció esetén egy függvényt adunk át utolsó paraméterként. Ez a visszahívási funkció, és az animáció befejeztével meghívásra kerül.
$("#element").animate(( // stuff to animate ), function() ( // callback function ));Talán kissé funky-nak tűnik, de lényegében csak ezt tesszük:
.animate(a, b)Hol avan egy tulajdonságok és értékek objektuma, és begy visszahívási függvény.
De az utolsó videóból tudjuk, hogy az animáció időzítési paramétert is vehet, amely meghatározza, hogy az animáció mennyi ideig tart. Hova megy ez? Ez egy opcionális paraméter, csakúgy, mint a visszahívási funkció. Ha használni szeretnénk, akkor középre tesszük, tehát lényegében:
.animate(propertiesObject, duration, callback);És van még egy opcionális paraméter, egy karakterlánc, amelyet átadhatunk az enyhítési érték megadásához.
.animate(propertiesObject, duration, easing, callback);A jQuery véletlenül ügyes és okos az opcionális paraméterekkel kapcsolatban. Ha elhagyja a középső kettőt, és csak átengedi a visszahívást, akkor az megmondhatja, hogy mi halad át, az egy függvény, nem pedig szám vagy karakterlánc, tehát tudja, hogy visszahívási funkcióra gondol. Nem kell hamis értékeket vagy semmit átadni. Ez csak jó API-tervezés!
A jQuery dokumentációját a következőképpen mutatják be:
.anim (tulajdonságok (, időtartam) (, enyhítés) (, teljes))
Ezután azonnal magyarázza el a várható típusokat.
De különben is, visszatérve a visszahívásokhoz. Nagyon beágyazódhat. Képzelje el, hogy egy másik animációt helyez a visszahívási funkcióba, és ennek az animációnak megvan a maga visszahívása. Ez teljesen ésszerű, mivel érdemes többlépcsős animációt készíteni. Csak szervezettnek kell maradnia.
Lásd a Pen 450c5810be27a9a8946cb8012cbd1213-t Chris Coyier (@chriscoyier) a CodePen-en
Itt csak az animációt használjuk példaként. A visszahívási funkciók talán még gyakoribb használata az Ajax. Az Ajax az, amikor a böngésző egy másik erőforrást keres az oldal frissítése nélkül. Ez teljesen ismeretlen időt vehet igénybe. Ez a sávszélességtől és a várakozási időtől, a fájl méretétől, a hibakörülményektől és mindenféle dologtól függ. Valószínűleg nem tehet semmit azzal az Ajax-kéréssel, amíg valamit nem kap vissza, vagy más módon nem kap további információt. A visszahívási funkciók tökéletesek erre, és később ezt is megismerjük.