有一种简单的方法来用JavaScript创建动态变量?
-
18-09-2019 - |
题
我已经建立了一个数据驱动的谷歌地图用不同的图标会被分配给依赖于位于项目的类型的地图。所以,如果我有5种类型的地标,每个都有不同的图标(商店,图书馆,医院等) - 我想要做的是产生谷歌的图标动态对象。我想是这样的:
types = array('hospital','church','library','store',etc);
var i=0;
while (i<=types.length) {
var landmark + i = new google.maps.Icon();
landmark.image = "icon" + i + ".png";
i++;
}
然而,正如你可能已经猜到,这是行不通的。我使用eval,像这样也尝试:
while (i<=types.length) {
doIcon(i);
i++;
}
function doIcon(i){
eval("var landmark" + i + " = new.google.maps.Icon();");
return eval("landmark" + i);
}
但它没有工作either--我欣赏动态地生成JavaScript变量任何指针。这一定是纯JS,我能做到这一点在PHP但在这里,这不是一个选项。
谢谢!
解决方案
这真的很容易做到:object["variablename"] = whatever;
因此,例如,你可以有一个对象:var Landmarks = {}
,你可以添加到它像这样:Landmarks["landmark" + i] = new google.maps.Icon();
,并通过这种方式
如果你需要这些变量是的全球的(为什么你会吗?),你可以直接使用window
访问全局对象。
其他提示
如果你打算使用声明的对象,如Landmark["landmark" + i]
做到这一点,你真的不妨使用索引阵列中,而不是一个关联,它是迭代容易得多。对象是不是真的有索引的属性使用,因为阵列做它一个更好的工作:
var myObj = // object version
{
"item0": "blah",
"item1": "blah"
// etc
}
var myArr = // array version
[
"blah",
"blah"
// etc
]
更明智使用数组:
landmarks = []; // new array
types = array('hospital','church','library','store',etc);
var i=0;
while (i<=types.length) {
landmarks.push(new google.maps.Icon());
landmarks[i].image = "icon" + i + ".png";
i++;
}
这更有意义,这样做的和for...in
环路上的对象可以得到一个有点乱与原型属性是枚举,等等。
如果你想使一个变量全局,把它添加到窗口对象:
var myCustomVar = "landmark" + i;
window[myCustomVar] = new google.maps.Icon();
alert(landmark0);
不过,这将是污染全局命名空间与许多不必要的变数。所以,你仍然会是一个数组更好:
window.landmarks = [];
landmarks.push(new google.maps.Icon());
// etc...
就可以直接回答你的问题(虽然请注意,这是不是你想要的解决方案。退房的答案。这仅仅是文档!),这里是一个复制粘贴从JavaScript控制台:
> window["myNamedVar"] = "Hello, World!";
> console.log(myNamedVar);
"Hello, World!"
您会更好创建javascript对象,其可以有所使用像关联数组在PHP使用:
var types = ['hospital','church','library','store'];
var landmarks= {};
for (var i in types) {
landmarks[types[i]]= new google.maps.Icon();
landmarks[types[i]].image = "icon" + i + ".png";
}
alert(landmarks['hospital'].image); // displays "icon0.png"
你真的需要这些变量?你能不能用这个做的:
var types = ['hospital','church','library','store'];
for(var i =0; i < types.length; i += 1) (new google.maps.Icon()).image = "icon" + i + ".png";
修改完成基于评论:
从图标+指数改变图标名称模式+ .PNG到图标+型+ .PNG 和保存在循环的结果。
types = ['hospital','church','library','store'];
var landmarks = {};
// images names are of the form icon + type + .png
function createIcon(type)
{
var icon = new google.maps.Icon();
icon.image = "icon" + type + ".png";
return icon;
}
// mapping of landamarks by type and icon
for (var i = 0, len = types.length; i < len; i++)
{
landmarks[types[i]] = createIcon(types[i]);
}
其结果是: { 医院:图标, 教堂:图标, ... }
其中图标是具有图像属性,该属性是以下形式的字符串中的谷歌地图图标“图标{类型} .PNG”,e.g,iconhostpital.png,iconchurch.png。
要使用图标写landmarks.type
其中类型是一个类型的数组,例如,在名称landmarks.hospital
。
如果图像名称的形式图标+数+ .png和每种类型的数目的是相当于其在阵列中的索引取代该呼叫createIcon(式[I]),用于createIcon(i)中。