如何在 Javascript 中创建数组数组？

Question

我已经为此苦恼了一段时间，所以我终于崩溃了，决定征求意见。

我必须构造一个使用坐标数组来勾勒地图的对象。我创建了一个数组数组（至少我认为），因此我可以遍历长度并创建所需的任意数量的对象。问题是，我的数组中的值是字符串——它们实际上并没有引用数组。然后对象生气并说它是一个无效参数。

我尝试使用 split()，但似乎没有效果。我手动输入了路径：boundaries0，这似乎工作得很好。我已经看这个很久了，我想我已经失去了脑细胞。如果有人甚至可以让我走上正确的道路，那就太棒了。

var arrays = 50; //Set this to how many arrays are created.

var boundariesAr = new Array;
var boundaries = new Array;
for(i=0;i<arrays;){
    boundariesAr.push('boundaries' + i);
    i++;
    };

for(j=0;j<boundariesAr.length;){
    var serviceArea = "serviceArea" + j;
    var currentArray = boundariesAr[j];
    var currentItem = currentArray.split(" ");

    serviceArea = new google.maps.Polygon({
        path:currentItem,
        geodesic:true,
        strokeColor:'#000',
        strokeOpacity:1.0,
        strokeWeight:2,
        fillColor: '#FF0000',
        fillOpacity: 0.35
        });
    serviceArea.setMap(map);
    j++;
    };

编辑 - 更新的代码（只有一个 sn-p） 这是对数组外观的截断视图：

var boundaries0 = [
new google.maps.LatLng(65.307997,-146.130689),
new google.maps.LatLng(65.291840,-146.198712),
];
var boundaries1 = [
new google.maps.LatLng(64.703884,-147.150958),
new google.maps.LatLng(64.703189,-147.155442),
];


var arrays = 50; //boundaries0[],boundaries1[], etc

var boundariesAr = new Array;

for(var i=0;i<arrays;i++){
    boundariesAr.push(boundaries);
    };
for(var j=0;j<boundariesAr.length;j++){
    var serviceArea = "serviceArea" + j;
    var currentArray = boundariesAr[j];
    var currentItem = currentArray.split(" ");

    serviceArea = new google.maps.Polygon({
        path:currentItem,
        geodesic:true,
        strokeColor:'#000',
        strokeOpacity:1.0,
        strokeWeight:2,
        fillColor: '#FF0000',
        fillOpacity: 0.35
        });
    serviceArea.setMap(map);
    };

感谢一些出色的人，他们抽出时间提供帮助。如果可以的话，我会给你买饮料。

这终于奏效了——（我觉得一开始就没有嵌套数组很傻）

var boundaries = [];
boundaries[0] = [
new google.maps.LatLng(65.307997,-146.130689),
new google.maps.LatLng(65.291840,-146.198712),
];
boundaries[1] = [
new google.maps.LatLng(64.703884,-147.150958),
new google.maps.LatLng(64.703189,-147.155442),
];

var arrays = 50; //Set this to how many arrays are created.

for(var j=0;j<arrays;j++){

    serviceArea = new google.maps.Polygon({
        path:boundaries[j],
    geodesic:true,
    strokeColor:'#000',
    strokeOpacity:1.0,
    strokeWeight:2,
    fillColor: '#FF0000',
        fillOpacity: 0.35
    });
serviceArea.setMap(map);
};

Answer 1

boundariesAr.push('boundaries' + i) 正在推动 "boundaries" 的 字符串连接 以及任何 i 在你的循环中（你最终会得到 50 个字符串："boundaries0" 到 "boundaries49" ）。您应该更改它以推送您想要推送的实际 Array 对象。哦，请确保将迭代变量声明为非全局变量（通过使用 var），这样 i 就不是全局变量 - 这将非常糟糕。

//                         V---------------here-------------
for(var i = 0; i < arrays; i++){   //                       |
    boundariesAr.push(boundaries); //                       |
    //i++; /*no need for this, just put it in the for loop - */
};

在这之后，你似乎想在你的阵列上运行split()，这会让你很伤心。 split() 用于字符串，因此您可以将字符串拆分为一个数组，该数组由您传递给split() 的任何字符分隔。例如，"Hello I am dog".split(" ") 将创建数组 ["Hello", "I", "am", "dog"]。但是您已经有一个数组，因此除非您需要对该数组进行字符串操作，否则最好删除该行。 （而现在，数组似乎还是空的）。

另一个问题：您将serviceArea 设置为一个字符串，然后立即用serviceArea = new google.maps.Polygon({...}) 覆盖它。如果您希望它是一个多边形，则不应该使用var serviceArea = "serviceArea" + j; 实例化它。这样就可以了：var serviceArea = new google.maps.Polygon({...})

Answer 2

您的“更新代码”有：boundariesAr.push(boundaries);，但据我所知，boundaries 是 undefined？

如果你想要一个数组数组不应该是这样的：

var boundaries = [
  [
    new google.maps.LatLng(65.307997,-146.130689),
    new google.maps.LatLng(65.291840,-146.198712)
  ],
  [
    new google.maps.LatLng(64.703884,-147.150958),
    new google.maps.LatLng(64.703189,-147.155442)
  ]
];

您也可以以这种方式创建它（如果您更容易按索引设置它们）：

var boundaries = [];
boundaries[0] = [
  'map thing',
  'map thing 2'
]
boundaries[1] = [
  'more map things',
  'more map things 2',
]

这将使您在执行boundaries[0] 时得到

[
  new google.maps.LatLng(65.307997,-146.130689),
  new google.maps.LatLng(65.291840,-146.198712)
]

这当然使您能够做到boundaries[0][0]。

使用new Array 创建一个新数组似乎很愚蠢。只需使用var myThing = [];

有了实际多维数组后，你应该可以这样做了：

for(var j=0;j<boundaries.length;j++){
  for( var b=0; b<boundaries[j].length;b++){
    currentItem = boundaries[j][b];
    // At this point currentItem is `new google.maps.LatLng(65.307997,-146.130689)`
    var serviceArea = new google.maps.Polygon({
      path:currentItem,
      geodesic:true,
      strokeColor:'#000',
      strokeOpacity:1.0,
      strokeWeight:2,
      fillColor: '#FF0000',
      fillOpacity: 0.35
    });
  }
  serviceArea.setMap(map); // Where does `map` come from?
}

如果您的边界实际上是一大堆单独的数组boundaries1、boundaries2...boundaries50，那么您要么需要将它们更改为更少（将它们放入数组中，就像我在这里提到的那样） ，否则你将无法做你想做的事。当您只有变量名作为字符串时，Javascript 无法从变量中检索值，我知道（而且我已经彻底查看过）。

基本上，您不能像尝试使用"boundaries" + i; 或类似的方式动态调用变量，除非您将它们放入适当的数组或对象数据结构中，否则没有办法做到这一点。

Answer 3

boundariesAr.push('boundaries' + i);

这是将一个元素（字符串）推入数组，而不是在第一个数组中放置另一个数组（我假设您希望如此）。

举一个 10x10 数组的简单示例：

var ary = []; // [] == new Array

for (var i = 0; i < 10; i++){
  ary[i] = []; // add a nested array (2D)
  for (var j = 0; j < 10; j++){
    // add a string within the nested array as an element
    ary[i].push('row' + i + ', col' + j);
  }
}

// debugging -- http://jsfiddle.net/Gv6kP/
console.log(JSON.stringify(ary));

Answer 4

这一行是你的问题：

boundariesAr.push('boundaries' + i);

您正在将一个字符串推入数组。要推送数组，只需这样做：

boundariesAr.push([]);

[] 是数组文字的表示法。