如何将字符串转换为对象引用或将数值添加到对象引用名称？

Question

我的问题应该很简单。

如果有助于解释，我目前正在使用一个名为 Leaflet 的 javascript 库。这个库允许我创建一个可自定义的在线地图，我可以添加标记，这就是我在这里所做的：

var iconId = null;

for (var i=1;i<4;i++)
{ 
  iconId = "mapMarker" + i; // L.marker does not accept this because it is a string and not an object
  var marker = L.marker([boulder.latitude, boulder.longitude], {icon: iconId}).addTo(map);
}

在另一个 JS 文件中，我创建了 3 个 mapMarker 对象，其属性符合 Leaflet 的文档。

var mapMarker1 = L.icon({
    iconUrl: 'img/mapMarker1.png'
});
var mapMarker2 = L.icon({
    iconUrl: 'img/mapMarker1.png'
});
var mapMarker3 = L.icon({
    iconUrl: 'img/mapMarker1.png'
});

如您所见，我目前有一个循环，它创建一个字符串，其中包含我要传递给 icon 参数的对象的名称，但 icon 参数需要一个对象，而不是字符串。有没有办法可以动态创建对象名称并将它们放在“iconId”中？我不想将它放入开关盒中，因为它对我的口味来说太大了。

谢谢！

Answer 1

每当您发现自己创建了一系列名称相似且名称中数字递增的变量时，您应该改用 JavaScript 中为此目的而设计的特性：数组。

创建一个地图标记数组，而不是编号变量：

var mapMarkers = [
    L.icon({
        iconUrl: 'img/mapMarker1.png'
    }),
    L.icon({
        iconUrl: 'img/mapMarker1.png'
    }),
    L.icon({
        iconUrl: 'img/mapMarker1.png'
    })
];

现在只需遍历该数组：

for( var i = 0;  i < mapMarkers.length;  i++ ) { 
    var marker = L.marker(
        [ boulder.latitude, boulder.longitude ],
        { icon: mapMarkers[i] }
    ).addTo( map );
}