反復中のコールバックスコープ

Question

コールバック、スコープ、クロージャに関する多くの質問があります。これが重複している場合は、事前にお詫び申し上げます。

私は、いくつかの非同期アクションを実行してコールバックを発行する関数を呼び出すループをそれぞれ持っています。私はコールバックが発生したときに（明らかに）スコープを失います。私がやったのは、ループの中のアイテムを関数に渡してコールバックで返すので、必要なスコープがあるからです。それはこれを行うための最善の方法ですか？私は過度に複雑なものを探しているわけではありません。私はちょうど私がどのような "つかの間"に遭遇するつもりはないことを確認したい。あなたが持っているもの

function doSomething(varA, varB, self, callback) { 
    // do a lot of ajax stuff 
    callback(varA + varB, self); 
} 

$.each($('.selected'), function(i, item) { 
    doSomething('a', 'b', item, function(retVal, self) { 
    // process retVal and self 
    } 
} 

Answer 1

は細かいが、1つの事を探します：.each()の代わりに$.each()を使用します。これを試してみてください：

$('.selected').each(function(i, item) { 
    doSomething('a', 'b', item, function(retVal, self) { 
    // process retVal and self 
    } 
} 

Answer 2

をあなたはdoSomething内の要素参照を必要としない場合は、あなたがこの中にクロージャを作成することができ、少し整然と方法：

function doSomething(varA, varB, callback) { 
    // do a lot of ajax stuff 
    callback(varA + varB); 
} 

$.each($('.selected'), function() { 
    var self = this; 
    doSomething('a', 'b', function(retVal) { 
    // process retVal and self 
    } 
}); 

Answer 3

主な「落とし穴」の人が実行into into ajaxとループは、後で実行される関数の中で反復変数を再利用しようとしています。例えば

for (var i in col) { 
    $.ajax({ 
    url: '...' + i + '.html', 
    success: function() { 
     console.log(i); // Why is i different??? 
    } 
    }); 
} 

このsuccessコールバックのすべての間で共有さiの1つのインスタンスがあるので、「落とし穴」が発生します。

「反復」レベルごとに1つずつiがあります。だから、この邪魔はあなたを襲わないでしょう。

Answer 4

callbackは、.each()ファンクション内に定義されているため、コールバック機能を使用するまでには、itemがまだ有効範囲にあります。したがって、doSomething()がselfを決して使用しない場合、それを渡す必要はありません。あなただけのitemを参照することができます。コールバックは.each()の外で定義されている場合

function doSomething(varA, varB, callback) { 
    // do a lot of ajax stuff 
    callback(varA + varB); 
} 

$('.selected').each(function(i, item) { 
    doSomething('a', 'b', function(retVal) { 
    // process retVal and item 
    }); 
}); 

さて、あなたはそれをあなたがそれを持っている方法を行う必要があるだろう、itemdoSomething()に渡し：それはある

function doSomething(varA, varB, self, callback) { 
    // do a lot of ajax stuff 
    callback(varA + varB, self); 
} 
function doSomethingCallback(retVal, self) { 
    // process retVal and item 
} 

$('.selected').each(function(i, item) { 
    doSomething('a', 'b', item, doSomethingCallback); 
});