2016-09-15 99 views
0

我想传递一个数组,我已经保存为var。我在父函数中声明var,并在父函数中添加arr作为参数。然后,我将arr作为回调调用中的参数。 控制台告诉我linksA是未定义的。从函数传递变量作为参数

var supportLists = function(selector, arr) { 
    var parentList = document.getElementById(selector); 
    var theList = parentList.querySelectorAll("a"); 

    var linksA = [ 
     "http://www.example.com", 
     "http://www.example.com/path2", 
     "1", 
     "2", 
     "4", 
     "3", 
     "5", 
     "6", 
     "7" 
    ]; 

    var linksB = [ 
     "1", 
     "2", 
     "3" 
    ]; 

    var linksC = [ 
     "1", 
     "2", 
     "3", 
     "4", 
     "5", 
     "6", 
     "7", 
     "8", 
     "9", 
     "10", 
     "11", 
     "12" 
    ]; 

    var linksD = [ 
     "1", 
     "2" 
    ]; 

    var linksE = [ 
     "1", 
     "2", 
     "3" 
    ]; 

    var linksF = [ 
     "1", 
     "2", 
     "3", 
     "4", 
     "5", 
     "6" 
    ]; 

    var linksG = [ 
     "1", 
     "2", 
     "3" 
    ]; 

    var linksH = [ 
     "1", 
     "2", 
     "3", 
     "4" 
    ]; 

    var linksI = [ 
     "1" 
    ]; 

    var linksJ = [ 
     "1", 
     "2", 
     "3", 
     "4", 
     "5" 
    ]; 

    function processLi(listItems, links) { 

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

      listItems.forEach(function(item, index) { 
       item.href = links[index]; 
       item.target = "_blank"; 

      }); 

     } 
    } 

    processLi(theList, arr); 
}; 

supportLists("support-list", linksA); 
supportLists("support-list-b", linksB); 
supportLists("support-list-c", linksC); 
supportLists("support-list-d", linksD); 
supportLists("support-list-e", linksE); 
supportLists("support-list-f", linksF); 
supportLists("support-list-g", linksG); 
supportLists("support-list-h", linksH); 
supportLists("support-list-i", linksI); 
supportLists("support-list-j", linksJ); 
+3

您试图在声明它们的函数外部使用那些'links'变量。 – 2016-09-15 17:13:43

+2

添加@squint答案,你可以声明数组在相同的范围上,函数将被调用并将它们作为参数传递给函数,或者传递链接数组的名称作为输入参数函数并在其中有一个逻辑来选择和使用正确的数组。 – GCSDC

+0

如果我将它们放入processLi函数中,会得到相同的错误。 除此之外,我不是在调用中使用它们,而是坐在父函数内部,而不是回调? – ardev

回答

1

如果你想用它在你想使用它或将它传递(给一个函数)的范围,这意味着它在该范围或将被宣布为获得一个变量一个父范围。

由于您将数组传递给supportLists函数,因此您必须在该函数之外声明它们。

如果移动功能以外的所有数组声明您的代码会是这个样子(我增加了一些注解,以显示其中一个范围开始,在哪里结束)

// This is the 'parent' scope (probably the global/window scope in your case) 

var linksA = [ 
    "http://www.example.com", 
    // ... 
]; 

// ... 

var linksJ = [ 
    "1", 
    "2", 
    "3", 
    "4", 
    "5" 
]; 

var supportLists = function(selector, arr) { 
    // Here begins the 'supportLists' function scope 
    // The 'supportLists' function has access to this scope and the 'parent' scope 
    var parentList = document.getElementById(selector); 
    var theList = parentList.querySelectorAll("a"); 

    function processLi(listItems, links) { 
     // Here begins the 'processLi' function scope 
     // The 'processLi' function has access to this scope, the 'supportLists' scope and the 'parent' scope 

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

      listItems.forEach(function(item, index) { 
       // Here begins the 'function(item, index)' function scope 
       // The 'function(item, index)' function has access to this scope, the 'processLi' scope, the 'supportLists' scope and the 'parent' scope 

       item.href = links[index]; 
       item.target = "_blank"; 
      });// Here ends 'function(item, index)' function scope 
      // Back in the 'processLi' function scope 
     } 
    } // Here ends the 'processLi' function scope 
    // Back in the 'supportLists' function scope 

    processLi(theList, arr); 
}; // Here ends the 'supportLists' function scope 
// Back in the 'parent' scope 

supportLists("support-list", linksA); 
supportLists("support-list-b", linksB); 
supportLists("support-list-c", linksC); 
supportLists("support-list-d", linksD); 
supportLists("support-list-e", linksE); 
supportLists("support-list-f", linksF); 
supportLists("support-list-g", linksG); 
supportLists("support-list-h", linksH); 
supportLists("support-list-i", linksI); 
supportLists("support-list-j", linksJ); 
+0

感谢,这工作。只是为了讨论,不应该var的回调作用域的范围,因为变量是在回调应该继承的父作用域内定义的吗? – ardev

+0

@ardev:在你的原始代码中定义了数组变量在'supportLists'函数范围内(而不是'parent'/ global scope),但是你想在全局范围内使用它们,这些数组变量是不可用/声明的。 /stackoverflow.com/questions/500431/what-is-the-scope-of-variables-in-javascript – Ma3x

0

目前,您的变量在本地范围内定义,因此它们在supportLists函数外部不可见。

解决方案:

定义函数外部的变量。例如,

var linksB = ["1", "2", "3"]; 
var supportLists = function(selector, arr) { //YOUR CODE } 
+0

#2不是一个解决方案,你需要调用函数来创建变量在您将变量作为参数调用之前,请先阅读它们。而且,全局变量是邪恶的。 – Bergi

+0

@Bergi谢谢指出。 –