Есть ли простой способ создания динамических переменных с помощью Javascript?
-
18-09-2019 - |
Вопрос
Я создал управляемую данными карту Google с различными значками, которые назначаются карте в зависимости от типа расположенного объекта.Итак, если у меня есть 5 типов ориентиров, и каждый из них имеет свой значок (магазин, библиотека, больница и т. д.) - я хотел бы динамически генерировать объекты значков Google.Я думал примерно так:
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);
}
но это тоже не сработало - я был бы признателен за любые указания по динамическому созданию переменных 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";
Изменения, внесенные на основе комментария:
Паттерн имени значка Изменен с Icon + Index + .png на Icon + type + .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]);
}
результат:{больница:икона, церковь:икона, ...}
где icon — это значок карты Google, имеющий атрибут изображения, который представляет собой строку вида «icon{type}.png», например, iconhostpital.png, iconchurch.png.
Для использования иконок напишите landmarks.type
где тип — это одно из имен в массиве типов, например. landmarks.hospital
.
если имена изображений имеют вид icon + номер + .png, а номер каждого типа эквивалентен его индексу в массиве, замените вызов createIcon(type[i]) на createIcon(i).