jqueryのコールバック関数(callback)の使い方を詳しく解説-jsチュートリアル-php.cn

jqueryのコールバック関数(callback)の使い方を詳しく解説

伊谢尔伦

リリース： 2017-06-16 16:41:59

オリジナル

5436 人が閲覧しました

jqueryを独学で勉強していた時、英単語(Callback)を見て、思わず背中に冷や汗をかきました。ちょっとグーグルで調べたところ、元の中国語翻訳は callback であることがわかりました。それがコールバック関数です。理解できなかったので、コールバック関数についてググってみたところ、インターネット上の中国語の説明はあまりにも「難解」であることがわかり、自分の才能と知識が不足していたことを認めました。いくつかのコールバックの例を読んだ後、少し理解できたように思います。以下はコールバック関数についての私の理解です。間違って理解している場合は、修正していただければ幸いです。 Q まず、jQuery Web サイトの英語の定義から始めましたが、中国人として本当に悲劇を感じます。コールバックの定義は国内の「専門家」が説明するぐるぐる回っているだけのようだ。浮雲、すべてが浮雲です。

コールバックとは、別の関数に引数として渡され、親関数の完了後に実行される関数です。

これはjsでの説明であり、他の言語では触れていません。

文字通り理解すると、コールバックは関数の呼び出しプロセスです。それでは、この呼び出しプロセスを理解することから始めましょう。関数 a には関数 b という 1 つのパラメータがあります。関数 a が実行されると、関数 b も実行されます。そして、このプロセスはコールバックと呼ばれます。

実際、中国語もわかりやすいです。コールバック、コールバック、コールバックという意味です。関数 a を先に終了し、後で関数 b を呼び出します。

実際の例: デートの後、彼女を家に送り届けるとき、あなたは必ず「家に帰ったらメッセージを送ってください。あなたのことが心配です。」と言うでしょう。実際にメッセージを送った後、ガールフレンドが返信します。少年、あなたにはチャンスがあります。

実際、これはコールバックプロセスです。あなたは機能 b (彼女にメッセージを送ってもらう) を彼女に残し、彼女が家に帰るという行動が機能 a です。彼女はまず家に戻り、関数 a の内容を実行し、次に関数 b を実行する必要があります。すると、メッセージが表示されます。

ここで 1 つ明確にしておく必要があります。関数 b はパラメーターの形式で関数 a に渡され、関数 b はコールバック関数と呼ばれます。

もしかしたら誰かが疑問を持っているかもしれません: 関数 b を関数 a で直接呼び出すことはパラメータの形式で渡す必要がありますか?確かにそれは可能です。解決中。

<質問回答: 関数 a 内で直接呼び出すと、コールバック関数が制限されます。ただし、

関数をパラメーターとして使用する

には、次のような利点があります。 a(b) を実行すると、関数 b はコールバック関数になり、a(c) も実行できる場合は、関数 c はコールバック関数になります。関数 a(){...;b();} を記述すると、変数の柔軟性が失われます。 >

理解の例:

<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>

ログイン後にコピー

コールバック関数は誰でも使用できますが、Jquery がコールバック関数をカプセル化すると、コールバック関数の実際の使い方を誰もが理解できるようになります。

JS API では、次のように説明されています。コールバックは、別の関数に引数として渡され、その親関数が完了した後に実行される関数です。

もちろん、JS でコールバック関数の魔法を実際に試すこともできます。

関数a内で直接呼び出すと、このコールバック関数は制限されます。ただし、関数をパラメーターとして使用すると、次のような利点があります。 a(b) を実行すると関数 b がコールバック関数になり、a(c) も実行できる場合は関数 c がコールバック関数になります。関数 a(){...;b();} を作成すると、変数の柔軟性が失われます。コードは次のとおりです:

<!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>

ログイン後にコピー

以上がjqueryのコールバック関数(callback)の使い方を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。