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

Question

我的问题应该相当简单。

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

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 中专为此目的而设计的功能:数组。

创建 map 标记数组而不是编号变量:

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 );
}