Y at-il un moyen facile de créer des variables dynamiques avec Javascript?

Question

Je l'ai construit une carte Google basée sur les données avec différentes icônes qui seront affectés aux carte en fonction du type d'élément situé. Donc, si j'ai 5 types de repère, et chacun obtient une autre icône (magasin, bibliothèque, hôpital, etc.) - ce que je voudrais faire est de générer les objets icône google dynamiquement. Je pensais quelque chose comme ceci:

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

Cependant, comme vous l'avez probablement deviné, cela ne fonctionne pas. J'ai aussi essayé d'utiliser eval, comme ceci:

while (i<=types.length) {
        doIcon(i);
        i++;
    }   

    function doIcon(i){ 
        eval("var landmark" + i + " = new.google.maps.Icon();");
        return eval("landmark" + i);
    }

mais il ne fonctionne pas, je vous en serais reconnaissant aux navires: tous les pointeurs sur la génération des variables javascript dynamiquement. Il faut que ce soit js pur, je pouvais le faire en PHP, mais ce n'est pas une option ici.

Merci!

Answer 1

Il est vraiment facile à faire: object["variablename"] = whatever;

Ainsi, par exemple, vous pourriez avoir un objet: var Landmarks = {} et vous pouvez y ajouter comme ceci:. Landmarks["landmark" + i] = new google.maps.Icon(); et transmettre de cette façon

Si vous avez besoin de ces variables à global (pourquoi voulez-vous?) Vous pouvez accéder à l'objet global directement à l'aide window.

Answer 2

Si vous allez le faire en utilisant un objet déclaré tel que Landmark["landmark" + i], vous pouvez vraiment aussi bien utiliser un tableau d'index plutôt qu'un associatif, il est beaucoup plus facile pour l'itération. Les objets ne sont pas vraiment utilisés avec les propriétés indexées car les tableaux font un bien meilleur travail de celui-ci:

var myObj =           // object version
{
   "item0": "blah",
   "item1": "blah"
   // etc
}
var myArr =           // array version
[
   "blah",
   "blah"
   // etc
]

Beaucoup plus judicieux d'utiliser le tableau:

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

Il est plus logique de le faire de cette façon et les boucles for...in sur des objets peut être un peu en désordre avec des propriétés prototypées étant dénombrable, etc.

Si vous essayez de faire une approche globale, la variable ajouter à l'objet de la fenêtre:

var myCustomVar = "landmark" + i;
window[myCustomVar] = new google.maps.Icon();

alert(landmark0);

Mais ce serait polluer l'espace de nommage global avec de nombreuses variables inutiles. Alors, tu serais encore mieux avec un tableau:

window.landmarks = [];
landmarks.push(new google.maps.Icon());
// etc...

Answer 3

Juste pour répondre à votre question directement (bien que s'il vous plaît noter que ce n'est pas la solution que vous voulez. Consultez les autres réponses. Ceci est juste pour la documentation! ), voici une copier-coller à partir d'un console JavaScript:

> window["myNamedVar"] = "Hello, World!";
> console.log(myNamedVar);
  "Hello, World!"

Answer 4

Vous feriez mieux de créer un objet javascript que vous pouvez utiliser un peu comme un tableau associatif est utilisé en 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"

Answer 5

Avez-vous vraiment besoin de ces variables? Ne pouvez-vous faire avec ceci:

var types = ['hospital','church','library','store'];    
for(var i =0; i < types.length; i += 1) (new google.maps.Icon()).image = "icon" + i + ".png";

Modifications réalisées en fonction de commentaire:

modèle de nom d'icône changé depuis l'icône + index + .png sur l'icône + type + .png et enregistrer les résultats de la boucle.

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

le résultat est le suivant: { hôpital: icône, église: icône, ... }

où l'icône est une icône google map qui a un attribut d'image qui est une chaîne de la forme "icône {type} .png", par exemple, iconhostpital.png, iconchurch.png.

Pour utiliser les icônes écrire landmarks.type où type est un des noms dans le tableau de types, par exemple landmarks.hospital.

si les noms d'image sont de l'icône de la forme + numéro + .png, et le nombre de chaque type est équivalent à son index dans le tableau remplacer le CreateIcon d'appel (type [i]) pour CreateIcon (i).