为什么命名函数在未命名时不起作用？

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这样的方法是增变器方法。