Quelle est la fonction de rappel? Je ne sais vraiment pas comment utiliser et fonctionner la fonction de rappel JS avant de l'apprendre. Dans l'article suivant, je vous présenterai les étudiants l'exemple de ma fonction de rappel d'apprentissage. Les étudiants qui ont besoin de savoir ne devraient pas faire attention de ne pas saisir la référence.
Principe de fonction de rappel:
Je vais partir maintenant et je t'informerai. "
Il s'agit d'un processus asynchrone. Pendant le processus de "Je vais" (exécution de fonction), "vous" peut tout faire ", arrive" (l'exécution de la fonction est terminée) et "vous informer" (rappel) une fois le processus de "vous informer" (rappel)
exemple
1. Méthodes de base
<script lingots = "javascript" type = "text / javascript"> function dosomething (callback) {//… // Appelez la fonction de callbackCallback ('Stuff', 'Goes', 'ici');} foo (a, b, c) {// je suis le callbackAlert (a + "" + b + "" + c);} dosomething (foo); </cript>Ou utilisez une fonction anonyme
<script lingots = "javascript" type = "text / javascript"> function dosomething (damsg, callback) {alert (damsg); if (typeof callback == "function") callback (); } dosomething ("function de rappel", function () {alert ("Identique à jQuery Callbacks Form!");}); </cript>2. Méthodes avancées
Méthode d'appel à l'aide de JavaScript
<script lingots = "javascript" type = "text / javascript"> function thing (name) {this.name = name;} thing.prototype.dosomething = function (callback) {// appelle notre rappel, mais en utilisant notre propre instance comme contextcallback.call (this);} function foo () {alert (this.name);} var t = new Thing ('Joe'); t.dosomething (foo); // Alerte "Joe" via `foo` </cript>Paramètres de passage
<Script Language = "javascript" type = "text / javascript"> function thing (name) {this.name = name;} thing.prototype.doSomething = function (rappel, saluting) {// appelle notre rappel, mais en utilisant notre propre instance comme contextcallback.call (this, Saluting);} function foo (Salatit nouvelle chose ('Joe'); t.dosomething (foo, 'hi'); // Alertes "Salut Joe" via `foo` </cript>Passer des paramètres en utilisant JavaScript
<Script Language = "javascript" type = "text / javascript"> function thing (name) {this.name = name;} thing.prototype.doSomething = function (callback) {// appelle notre rappel, mais en utilisant notre propre instance comme la fonction contextCallback.Apply (this, ['hi', 3, 1, 1]);} function foo (Salut + this.name + "" + trois + "" + deux + "" + un);} var t = new Thing ('Joe'); t.dosomething (foo); // Alertes "Salut Joe 3 2 1" via `foo` </cript>exemple
// Si la source de données fournie est un entier, qui est le score d'un étudiant, lorsque Num <= 0, il est traité par la couche sous-jacente, et lorsque N> 0, il est traité par la couche supérieure.
// Copiez la fonction suivante et enregistrez-la sur 1.js
fonction f (num, callback) {if (num <0) {alert ("Appelez la fonction de bas niveau à traiter!"); alert ("Le score ne peut pas être négatif, Erreur d'entrée!"); } else if (num == 0) {alert ("Appelez la fonction de bas niveau à traiter!"); alert ("L'étudiant n'a peut-être pas passé l'examen!"); } else {alert ("Appelez la fonction de haut niveau à traiter!"); callback (); }}// Enregistrez le fichier test.html suivant dans le même répertoire que 1.js:
<! Doctype html public "- // w3c // dtd html 4.01 transitional // en" "http://www.w3.org/tr/html4/loose.dtd"> <html> <éad> <méta http-equiv = "contenu-type" content = "text / html; charset = gb2312 "> <script src =" 1.js "type =" text / javascript "> </ script> <tle title> Undled Document </ title> <script type =" text / javascript "> function test () {var p = document.getElementById (" pp "); pp.innerText = ""; var num = document.getElementById ("score"). valeur; f (num, function () {// Fonction de traitement de haut niveau anonyme if (num <60) alert ("a échoué!"); else if (num <= 90) alert ("Excellent résultat!"); else alert ("Excellent résultat!");}) pp.innerText = "par depuis 1978 qq558064!" } </ script> </ head> <body> <p> Fonction de rappel Exemple: Lorsque l'étudiant marque <= 0 points, la couche inférieure le gérera; Lorsque le score> 0, la couche supérieure le gérera. </p> Veuillez saisir les scores des étudiants <Type d'entrée = "Text" id = "Score"> <Type de saisie = "Button" OnClick = "Test ()" Value = "Consultez les résultats"> <p Id = "PP"> </p> </ body> </html>Voici les ajouts d'autres internautes:
Mode de rappel dans JavaScript:
Comme indiqué dans:
function writeCode (callback) {// Exécuter certaines choses, callback (); // ...} fonction intrucebugs () {//....Introduce vulnérabilité} writeCode (intrucebugs);Nous transmettons l'application de la fonction à writeCode (), de sorte que WriteCode l'exécute au moment approprié (revenez pour l'appeler plus tard)
Regardons d'abord un exemple pas si bon (il sera refactorisé plus tard):
// simulez les nœuds DOM dans la page de recherche et renvoyez les nœuds trouvés dans le tableau uniformément // Cette fonction n'est utilisée que pour ne trouver aucun traitement logique pour les nœuds DOM var findNodes = function () {var i = 100000; // un grand nombre de boucles, var nœuds = []; // utiliser pour stocker les nœuds DOM trouvés var trouvés; tandis que (i) {i - = 1; nœuds.push (trouvé); } RETOUR NODES; } // masquer tous les nœuds DOM trouvé var hide = fonction (nœuds) {var i = 0, max = nœuds.length; pour (; i <max; i ++) {// il y a des supports après avoir trouvé des nodes pour indiquer l'exécution immédiatement. Exécutez d'abord findNodes () puis exécutez Mide () <mashor (findNodes ()); exécuter la fonction}; nœuds [i] .style.display = "None"} La méthode ci-dessus est inefficace. On pense que Hide () doit traverser les nœuds de tableau renvoyés par FindNodes () à nouveau. Comment éviter de telles boucles inutiles. Nous ne pouvons pas masquer directement le nœud de requête dans FindNodes (cette recherche peut modifier le couplage logique), il n'est donc plus une fonction générale. La solution consiste à utiliser le mode de rappel, où vous pouvez transmettre la logique cachée du nœud sur findNodes () dans une fonction de rappel et le déléguer pour exécuter // refactor findNodes pour accepter une fonction de rappel var findNodes = fucntion (callback) {var i = 100000, nœuds = [], trouvé; // Vérifiez si la fonction de rappel est disponible pour le rappel if (typeof callback! == 'function') {callback = false; } while (i) {i - = 1; if (callback) {callback (trouvé); } nœuds.push (trouvé); } RETOUR NODES; } // vérification de la fonction var masquage = fonction (node) {node.style.display = 'non'; } // Trouvez le nœud ultérieur et masquez-le dans l'exécution suivante findNodes (masquer); // exécuter FindNodes d'abord puis masquer. Bien sûr, la fonction de rappel peut également être créée lors de l'appel de la fonction principale: findNodes (fonction (node) {node.style.display = 'Aucun';});