2017-12-20 9 views
2

これはもっと一般的な質問ですが、私はここで同様の答えを読んだことがありますが、それ以上の概要は見つかりません。私はコールバックが新しく、いつ使うべきかを理解しようとしています。コールバック関数の目的を理解する

MDN web docsにはこの例があります。

function greeting(name) { 
    alert('Hello ' + name); 
} 

function processUserInput(callback) { 
    var name = prompt('Please enter your name.'); 
    callback(name); 
} 

processUserInput(greeting); 

は、しかし、私はこれは私がパラメータとして挨拶機能を渡していないよ以下、より有益であるかを確認するために苦労していますか?

function greeting(name) { 
    alert('Hello ' + name); 
} 

function processUserInput() { 
    var name = prompt('Please enter your name.'); 
    greeting(name); 
} 

processUserInput(); 
+1

テストするのが簡単で、よりゆるやかに結合され、単一の責任原理に理想的です。 – Ben

+0

console.logのように名前を警告する以外の機能を渡すこともできるので、例えば – user184994

+0

のような名前を使用することができます。 – George

答えて

1

結果)。要点は、後で実行される機能を別に設定することです。これは、通常、現在実行するために必要な入力がないためです。 実装とMDNの2つの主な違いは、メンテナンスが難しく、テストが難しいことです。

1. Maintanance /再利用性が

あなたがprocessUserInput()が何を変更する必要がしているし、コードベースにコードの数千行をしている想像してみてください。関数processUserInput()を変更する代わりに、新しいコールバック関数を変更または書き込む方がはるかに簡単です。これは、processUserInputがもう少し複雑な場合には明らかです。これはまた、あなたの実装とは違って、さまざまなシナリオでMDNの方がはるかに役立つことを意味します。 processUserInput()にプラグインするために異なるコールバックを書くだけで、別れを告げる、名前を大文字にするなどのさまざまな状況で再利用できます。

2。テストする/推論するのが簡単

MDNの実装ははるかに理解しやすくなります。 processUserInput(greeting)関数が、おそらくprocessUserInput()が何をするかを想定するよりも、あいさつを返すと想定する方が簡単です。 MDNの実装が常に入力と同じ出力を返すことが常に確かめることができるので、テストがより簡単になります。

-2

この例では、単純な言語のコールバック関数でコールバック

を理解するには適していません我々は後、または他のイベントや関数や式の応答にいくつかのものをしなければならないときに使用されています。 つまり、親関数がその実行を完了すると、コールバックが実行されます。 Javascriptが非同期であるよう

単純な例

function hungerStatus(status,cb){ 
    return cb(status) 
} 
function whatToDo(status){ 
    return status ? "order Pizza" : "lets play" 
} 

hungerStatus(false,whatToDo) 

別の例

// global variable​ 
​var allUserData = []; 
​ 
​// generic logStuff function that prints to console​ 
​function logStuff (userData) { 
    if (typeof userData === "string") 
    { 
     console.log(userData); 
    } 
    else if (typeof userData === "object") 
    { 
     for (var item in userData) { 
      console.log(item + ": " + userData[item]); 
     } 
​ 
    } 
​ 
} 
​ 
​// A function that takes two parameters, the last one a callback function​ 
​function getInput (options, callback) { 
    allUserData.push (options); 
    callback (options); 
​ 
} 
​ 
​// When we call the getInput function, we pass logStuff as a parameter.​ 
​// So logStuff will be the function that will called back (or executed) inside the getInput function​ 
getInput ({name:"Rich", speciality:"JavaScript"}, logStuff); 

は、時には元のための非ブロッキング機能からの応答を処理することは困難である、callback exaplanation

+1

これは完全な落胆である。 – kaushlendras

3

参照します。あなたがajaxの呼び出しを行っている場合、それは非同期に実行され、結果はいつかメインの実行フローがAjaxコードを渡し、次のステートメントの実行を開始するまでに返されます。プロセスへの応答。

これらのケースを処理するために、関数をパラメータとしてajax関数に渡し、レスポンスが返されると、応答データをパラメータとして渡してさらにコールするコールバックが呼び出されます。簡単に言えコールバックは、あなたがこれで終わったときに、通常は(これを行う、すなわち、質問をして(またはタスクを要求する)は、予めの方法であると言うことができるで

ここ

詳細http://callbackhell.com/

1

コールバックは状況によっては非常に便利です。たとえば、JavaScriptを使用してGoogle Chromeのブラウザ拡張を開発する場合、セットアップが完了した後にコールバックを使用してインターセプトすることができます。

一般的なコールバックの目的は、トリガ時にコールバックルーチンを実行させることです。トリガは何らかの種類のイベントです。通常、機能はチェーン化されたAPIのインターフェイスに従います。コールバックサポートを実装することで、操作の段階で実行フローをリダイレクトできます。コールバックは、サードパーティの開発者が何をしようとしているかによってelsesライブラリを扱うときに特に便利です。それらを通知システムのように考える。

一般にパラメータを取り込む機能は、柔軟性とメンテナンスに役立ちます。さまざまな機能を異なるものに使用すると、機能を何度も何度も何度も再利用してさまざまな機能を提供することができます。同じコードを何度も繰り返してソースコードを膨らませないようにします。同時に、自分のライブラリに関数を使用してバグが表示された場合は、その関数のために単純にパッチを当てて解決することができます。

あなたの例では、呼び出し元の関数、つまり呼び出す関数にコールバックルーチンを渡すと、コールバック関数が呼び出され、正しいパラメータが渡されます。これは、変数の内容を表示するためのコールバックルーチンと、渡された文字列の長さを計算するためのコールバックルーチン、または別の場所にロギングするためのコールバックルーチンを持つことができるので、柔軟性があります。元の機能を元に戻さずに、正しいパラメータで呼び出された別の機能を持つようにしてください。

関連する問題