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

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.


})

演示:

这是一个示例版本，您可以将其作为代码的基础:http://jsfiddle.net/JLK6N/2/

已更新修复:http://jsfiddle.net/JLK6N/3/

请记住，对象是通过引用传递的，数组是对象，.push 等方法是增变器方法。