javascript - JavaScriptのコールバック関数をよりよく理解する

Question

関数をコールバックとして別の関数に渡して実行させることは理解していますが、それを行うための最良の実装を理解していません。私はこのような非常に基本的な例を探しています：

var myCallBackExample = {
    myFirstFunction : function( param1, param2, callback ) {
        // Do something with param1 and param2.
        if ( arguments.length == 3 ) {
            // Execute callback function.
            // What is the "best" way to do this?
        }
    },
    mySecondFunction : function() {
        myFirstFunction( false, true, function() {
            // When this anonymous function is called, execute it.
        });
    }
};

myFirstFunctionで、new callback（）を返すと、匿名関数が機能して実行されますが、それは私にとって正しいアプローチではないようです。

score 133 · Accepted Answer

あなたはただ言うことができます

callback();

または、コールバック内でcallの値を調整する場合は、このメソッドを使用できます。this

callback.call( newValueForThis);

関数内にはthis何でもnewValueForThisあります。

score 91 · Accepted Answer

コールバックが存在し、実行可能な関数であるかどうかを確認する必要があります。

if (callback && typeof(callback) === "function") {
    // execute the callback, passing parameters as necessary
    callback();
}

多くのライブラリ (jQuery、dojo など) は、非同期関数に同様のパターンを使用し、すべての非同期関数に node.js を使用します (nodejs は通常、コールバックに渡さerrorれdataます)。ソースコードを調べると役に立ちます。

score 34 · Accepted Answer

関数を実行するには、主に3つの可能性があります。

var callback = function(x, y) {
    // "this" may be different depending how you call the function
    alert(this);
};

callback（argument_1、argument_2）;
callback.call（some_object、argument_1、argument_2）;
callback.apply（some_object、[argument_1、argument_2]）;

選択する方法は、次のいずれかによって異なります。

引数は配列に格納されているか、個別の変数として格納されています。
あるオブジェクトのコンテキストでその関数を呼び出したいとします。この場合、そのコールバックで「this」キーワードを使用すると、call（）またはapply（）で引数として渡されたオブジェクトが参照されます。オブジェクトコンテキストを渡したくない場合は、nullまたはundefinedを使用します。後者の場合、グローバルオブジェクトが「this」に使用されます。

Function.call、 Function.applyのドキュメント

score 6 · Accepted Answer

コールバックはシグナルに関するものであり、「新規」はオブジェクトインスタンスの作成に関するものです。

この場合、「callback();」だけを実行する方が適切です。とにかく戻り値で何もしていないので、「return new callback()」よりも。

(そして、arguments.length==3 テストは本当にぎこちなく、fwiw、コールバックパラメータが存在し、関数であることを確認する方が適切です。)

score 6 · Accepted Answer

適切な実装は次のようになります。

if( callback ) callback();

これにより、コールバックパラメータがオプションになります。

score 2 · Accepted Answer

以下を使用できます。

if (callback && typeof(callback) === "function") {
    callback();
}

以下の例は、もう少し包括的です。

function mySandwich(param1, param2, callback) {
  alert('Started eating my sandwich.\n\nIt has: ' + param1 + ', ' + param2);
  var sandwich = {
      toppings: [param1, param2]
    },
    madeCorrectly = (typeof(param1) === "string" && typeof(param2) === "string") ? true : false;
  if (callback && typeof(callback) === "function") {
    callback.apply(sandwich, [madeCorrectly]);
  }
}

mySandwich('ham', 'cheese', function(correct) {
  if (correct) {
    alert("Finished eating my " + this.toppings[0] + " and " + this.toppings[1] + " sandwich.");
  } else {
    alert("Gross!  Why would I eat a " + this.toppings[0] + " and " + this.toppings[1] + " sandwich?");
  }
});

score 1 · Accepted Answer

callback()JavaScript の関数を説明する基本的な例を次に示します。

var x = 0;

function testCallBack(param1, param2, callback) {
  alert('param1= ' + param1 + ', param2= ' + param2 + ' X=' + x);
  if (callback && typeof(callback) === "function") {
    x += 1;
    alert("Calla Back x= " + x);
    x += 1;
    callback();
  }
}

testCallBack('ham', 'cheese', function() {
  alert("Function X= " + x);
});

JSFiddle

score 1 · Accepted Answer

function checkCallback(cb) {
  if (cb || cb != '') {
    if (typeof window[cb] === 'undefined') alert('Callback function not found.');
    else window[cb].call(this, Arg1, Arg2);
  }
}

javascript - JavaScriptのコールバック関数をよりよく理解する

8 に答える 8

Related

Reference