Maison > interface Web > js tutoriel > le corps du texte

Explication détaillée de la façon d'utiliser la fonction de rappel (callback) dans jquery

伊谢尔伦
Libérer: 2017-06-16 16:41:59
original
5399 Les gens l'ont consulté

Quand j'apprenais jquery par moi-même, j'ai vu un mot anglais (Callback), et tout à coup j'ai senti une sueur froide dans mon dos. Après une recherche rapide sur Google, j'ai découvert que la traduction chinoise originale était un rappel. C'est la fonction de rappel . Je n'ai pas compris, alors j'ai cherché sur Google la fonction de rappel et j'ai trouvé que les explications chinoises sur Internet étaient trop « ésotériques ». J'ai admis que je manquais de talent et de connaissances. Après avoir lu quelques exemples de rappel, il me semble comprendre un peu. Ce qui suit est ma compréhension de la fonction de rappel. Si je comprends mal, veuillez me corriger, je vous en suis très reconnaissant.

Tout d'abord, commençons par la définition anglaise sur le site jquery. En tant que chinois, je me sens vraiment tragique. La définition d'un rappel est interprétée par des "experts" nationaux. Il semble qu'il ne soit un expert que s'il vous fait participer. Nuages ​​flottants, tout est nuages ​​flottants.

Un rappel est une fonction qui est passée en argument à une autre fonction et qui est exécutée une fois sa fonction parent terminée.

C'est l'explication en js, je ne compte pas l'explication dans d'autres langues.

Au sens littéral, le rappel est le processus d'appel d'une fonction. Commençons donc par comprendre ce processus d’appel. La fonction a a un paramètre, qui est la fonction b. Lorsque la fonction a est exécutée, la fonction b est exécutée. Ce processus est alors appelé rappel.

En fait, le chinois est aussi facile à comprendre : callback, callback, signifie rappeler. Terminez la fonction a à l’avance et appelez la fonction b plus tard.

Un exemple concret : vous renvoyez votre petite amie à la maison après un rendez-vous. Lorsque vous lui direz au revoir, vous direz certainement : "Envoyez-moi un message quand vous rentrerez à la maison. Je m'inquiète pour vous." ? Ensuite, votre petite amie vous a envoyé un message après son retour à la maison. Garçon, tu as une chance.

En fait, il s'agit d'un processus de rappel. Vous laissez une fonction b (demander à votre petite amie de vous envoyer un message) à votre petite amie, puis votre petite amie rentre chez elle. L'action de rentrer chez elle est la fonction a. Elle doit d'abord rentrer chez elle, exécuter le contenu de la fonction a, puis exécuter la fonction b, et vous recevrez alors un message.

Une chose doit être claire ici : la fonction b est passée à la fonction a sous la forme d'un paramètre, puis la fonction b est appelée fonction de rappel.

Peut-être que quelqu'un a des questions : dois-je le passer en paramètre ? Je ne peux pas appeler la fonction b directement dans la fonction a ? En effet, c’est possible. Résoudre.

utiliser la fonction comme paramètre présente les avantages suivants : lorsque vous faites a(b), la fonction b devient une fonction de rappel, et lorsque vous pouvez également faire a(c), la fonction c devient une fonction de rappel. fonction. Si vous écrivez la fonction a(){...;b();}, vous perdez la flexibilité de la variable . >

Exemple de compréhension :

<html> 
 
<head> 
 
<title>回调函数(callback)</title> 
<script language="javascript" type="text/javascript"> 
function a(callback) 
{    
    alert("我是parent函数a!"); 
    alert("调用回调函数"); 
    callback(); 
} 
function b(){ 
alert("我是回调函数b"); 
 
} 
function c(){ 
alert("我是回调函数c"); 
 
} 
 
function test() 
{ 
    a(b); 
   a(c); 
} 
 
</script> 
</head> 
 
<body> 
<h1>学习js回调函数</h1> 
<button onClick=test()>click me</button> 
<p>应该能看到调用了两个回调函数</p> 
</body> 
 
</html>
Copier après la connexion

Tout le monde peut utiliser la fonction de rappel, mais une fois que Jquery l'a encapsulée, tout le monde ne peut pas comprendre le fonction de rappel.

JS Api explique ceci : Un rappel est une fonction qui est passée en argument à une autre fonction et qui est exécutée une fois sa fonction parent terminée.

Bien sûr, nous pouvons réellement le faire en JS. Essayez la magie des fonctions de rappel.

Si vous l'appelez directement dans la fonction a, alors la fonction de rappel sera restreinte. Mais utiliser des fonctions comme paramètres présente les avantages suivants : lorsque vous exécutez a(b), la fonction b devient une fonction de rappel, et lorsque vous pouvez également exécuter a(c), la fonction c devient une fonction de rappel. Si vous écrivez function a(){...;b();}, vous perdez la flexibilité des variables. Voici le code :

<!DOCTYPE HTML> 
<html> 
<head>  
<meta charset="GBK" />
<title>回调函数(callback)</title> 
<script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.9.0/jquery.min.js"></script>
<script language="javascript" type="text/javascript"> 
    var f;
    function d(){
        alert("我是Jquery定义的函数d");
    }
    var e = function(){
        alert("我也是Jquery定义的函数e");
    }
    
    function a(callback) {    
        alert("我是parent函数a!");   
        d(); 
        if (typeof callback === "function"){
            //alert(callback);
            callback(); 
        }
    } 
    function b(){ 
        alert("我是回调函数b");  
      
        d();
        e();
        f();
    } 
    function c(){ 
        alert("我是回调函数c");   
        d();
        e();
        f();
    } 
    function test1() { 
        a(b); 
    } 
    function test2() { 
        a(c); 
    } 
    $(function(){ 
        f = function(){ 
            alert("我是回调函数f");   
        } 
    });
</script> 
</head> 
<body > 
    <h1>学习js回调函数</h1> 
    <button onClick=test1()>test a(b)</button> 
    <button onClick=test2()>test a(c)</button> 
    <p>应该能看到调用了两个回调函数</p> 
    <p > </p> 
</body> 
</html>
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal