名前の付いていない関数がなぜ機能しないのですか？

Question

私はこのコードを持っていた：

$('#testsPane').live("click", function() {//if the secondary ui nav tests is 

selected 

//Displays the test list 

var listOfTests = ""; 

    var subjects = []; 
    var tests= []; 
    var titles = []; 

    var keysplit; 
    var testSubj; 

    var key, value; 
    for (var i = 0; i < localStorage.length; i++) { 
     key = localStorage.key(i); 
     value = localStorage.getItem(key); 

     keysplit = key.split("."); 


     tests.push(value); 
     titles.push(keysplit[0]); 
     subjects.push(keysplit[keysplit.length-1]); 




} 


for(var i=0; i < tests.length; i++) { 

    listOfTests += '<div class="testDisplayBox"><div 

class="subjColorBar"></div><div class="testListIndiContain"><span 

class="testListTitle">' + titles[titles.length-(i+1)] + '</span><span> in 

</span><span class="testListSubj">' + subjects[subjects.length-(i+1)] + 

'</span></div><div class="testListTags"><span 

class="specTags">quiz</span></div></div>'; 

} 

    var testsDashboard = '<div id="testsList">' + listOfTests + '</div>'; 

$('#selectedPane').append(testsDashboard);//adds the html to the pane to make it 

into the tests dashboard 

}) 

上記のコードは働いていたが、私は、私は関数にそれを置くので、それの一部を再利用したかったです。私がそれをしたとき、それはうまくいかなかった。どんな考え？以下のコードは、名前付き関数を使用しています。

function grabTestList() {//Displays the test list 

    var keysplit; 
    var testSubj; 
    var key, value; 
    for (var i = 0; i < localStorage.length; i++) { 
     key = localStorage.key(i); 
     value = localStorage.getItem(key); 

     keysplit = key.split("."); 


     tests.push(value); 
     titles.push(keysplit[0]); 
     subjects.push(keysplit[keysplit.length-1]); 

}} 
$('#testsPane').live("click", function() {//if the secondary ui nav tests is selected 

grabTestList(); 

    var listOfTests = ""; 
     var subjects = []; 
     var tests= []; 
     var titles = []; 

for(var i=0; i < tests.length; i++) { 

    listOfTests += '<div class="testDisplayBox"><div class="subjColorBar"></div><div class="testListIndiContain"><span class="testListTitle">' + titles[titles.length- 

(i+1)] + '</span><span> in </span><span class="testListSubj">' + subjects[subjects.length-(i+1)] + '</span></div><div class="testListTags"><span 

class="specTags">quiz</span></div></div>'; 

} 

    var testsDashboard = '<div id="testsList">' + listOfTests + '</div>'; 

$('#selectedPane').append(testsDashboard);//adds the html to the pane to make it into the tests dashboard 
}) 

Answer 1

名前付き関数では不明な匿名関数のコンテキストで変数を定義しているためです。それらをgrabTestListに渡すので、.pushメソッドはこれらの配列を突然変異させることができます。

function grabTestList(tests, titles, subjects) { 
    // manipulate tests/titles/subjects 
} 

$('blah').live('click', function() { 
    var tests = [], titles = [], subjects = []; 

    grabTestList(tests, titles, subjects); 

    // since tests, titles, and subjects are mutated by the function, you can just loop through them here. 


}) 

DEMO：http://jsfiddle.net/JLK6N/2/修正で更新

：

ここでは、あなたが上のコードをベースにすることができ、サンプル版ですhttp://jsfiddle.net/JLK6N/3/

は、オブジェクトは参照渡しされていることに注意してください、配列はオブジェクトであり、.pushのようなメソッドはmutatorメソッドです。