Variables «variables» en Javascript?

101

Je sais qu'il est possible en PHP d'avoir des variables "variables". Par exemple

$x = "variable";
$$x = "hello, world!";
echo $variable; // displays "hello, world!"

Est-il possible de faire référence à une variable par son nom sous forme de chaîne en javascript? Comment cela se ferait-il?

ShoeLace1291
la source
les tableaux ne sont pas des variables, si vous utilisez un tableau comme argument de fonction, l'interpréteur JS utilisera un pointeur vers votre tableau. Dans la programmation, l'utilisation de certains termes est précise, et ce que vous demandez n'a que très peu de sens
Mister Jojo

Réponses:

147

Il n'y a pas de solution unique pour cela (enfin, il y en a eval, mais ne le considérons pas sérieusement). Il est possible d'accéder dynamiquement à certaines variables globales via window, mais cela ne fonctionne pas pour les variables locales à une fonction. Les variables globales qui ne deviennent pas une propriété de windowsont des variables définies avec letet const, et classes.

Il y a presque toujours une meilleure solution que d'utiliser des variables variables! Au lieu de cela, vous devriez examiner les structures de données et choisir celle qui convient à votre problème.

Si vous avez un ensemble fixe de noms, comme

// BAD
var foo = 42;
var bar = 21;

var key = 'foo';
console.log(eval(key));

stockez ces noms / valeurs comme propriétés d'un objet et utilisez la notation entre crochets pour les rechercher dynamiquement:

// GOOD
var obj = {
  foo: 42,
  bar: 21,
};

var key = 'foo';
console.log(obj[key]);

Dans ES2015 +, il est encore plus facile de le faire pour les variables existantes en utilisant une notation de propriété concise :

// GOOD
var foo = 42;
var bar = 21;
var obj = {foo, bar};

var key = 'foo';
console.log(obj[key]);


Si vous avez des variables numérotées "consécutivement", telles que

// BAD
var foo1 = 'foo';
var foo2 = 'bar';
var foo3 = 'baz';

var index = 1;
console.log(eval('foo' + index));

alors vous devriez utiliser un tableau à la place et utiliser simplement l'index pour accéder à la valeur correspondante:

// GOOD
var foos = ['foo', 'bar', 'baz'];
var index = 1;
console.log(foos[index - 1]);

Félix Kling
la source
Exemples de définition de plusieurs valeurs: var x = 1; var x, y = 2; x = 1; var x = 1, y = 2; var x = xx = 1; var y = x + x;
Amin Maleki
42

Si vous êtes désespéré de faire cela, vous pouvez soit essayer d'utiliser eval ():

var data = "testVariable";
eval("var temp_" + data + "=123;");
alert(temp_testVariable);

Ou en utilisant l'objet window:

var data = "testVariable";
window["temp_" + data] = 123;
alert(window["temp_" + data]);

http://www.hiteshagrawal.com/javascript/dynamic-variables-in-javascript

Masterbuddha
la source
evalimpossible de créer des variables locales en mode strict. Un appel indirect peut cependant créer des variables globales.
Oriol
4

Pour référencer une variable en javascript avec seulement une chaîne, vous pouvez utiliser

window['your_variable_name']

Vous pouvez également définir et référencer des variables et des objets dans des variables.

Awesomeness01
la source
4

Contrairement à PHP, JavaScript n'offre pas d'accès au tableau globals (qui contient des références à tous les noms de variables actuellement déclarés). En tant que tel, JavaScript n'offre pas de prise en charge native des variables variables. Cependant, vous pouvez émuler cette fonctionnalité tant que vous définissez toutes vos variables dans le cadre d'un tableau ou d'un objet. Cela créera à son tour un tableau gloabls pour vous. Par exemple, au lieu de déclarer la variable hellodans la portée globale comme ceci:

var hello = 'hello world';

encapsulons-le dans un objet. Nous appellerons cet objet vv (variables variables):

var vv = {
    'hello': 'hello world',
    //Other variable variables come here.
},
referToHello = 'hello';

Maintenant, nous pouvons faire référence à la variable par son index, et comme les index de tableau peuvent être fournis en utilisant une variable, nous utilisons de facto une variable variable:

console.log(vv[referToHello]); //Output: hello world

La réponse à votre question

Appliquons ceci au code que vous avez fourni dans la question d'origine:

    var vv = {
        'x': 'variable',
        'variable': 'hello world!'
    };
    console.log(vv[vv['x']]); //Displays "hello, world!"

Une utilisation pratique

Bien que le code précédent puisse sembler ridiculement encombrant et peu pratique, il existe des utilisations pratiques des variables variables dans JavaScript en utilisant ce type d'encapsulation. Dans l'exemple ci-dessous, nous utilisons le même concept pour obtenir l'ID d'un nombre indéfini d'éléments HTML.

var elementIds = [],
        elements = ['message','fillOrStroke','sizePicker','colorPicker']; //The items in this array could be defined automatically via an input, database query, event, etc.
        elements.forEach( (element) => {
            elementIds[element] = document.getElementById(element);
        });

Cet exemple déclare des variables variables (clés d'entrée elementIds) en fonction de l'ID de chaque élément, et attribuera le nœud dudit élément comme valeur de chaque variable. Et comme l'utilisation de variables globales dans JavaScript est généralement déconseillée, donner à vos variables variables une portée unique (dans ce cas, les déclarer à l'intérieur du elementIdstableau) est non seulement soigné, mais aussi plus responsable.

Nadav
la source
2

Bien sûr, vous pouvez, mais ne le faites pas. Les variables doivent être globales.

var killingFunction = 'alert'
var killMeNow = 'please'
var please = 'You have been killed!'
this[killingFunction](this[killMeNow])
Konrad Borowski
la source
2
var vars = {};
var var_name = "str";
vars[var_name] = "working";
console.log(vars["str"]);
lkdhruw
la source
0

Vous pouvez utiliser le JavaScript eval(str) fonction .

Cette fonction convertit la chaîne fournie en code JS, puis l'exécute.

Par exemple:

eval("console.log('hello world')"); // Logs hello world

Donc, pour l'utiliser comme variable variable, vous pouvez faire ce qui suit:

var a = "hello";
var hello = "world";
console.log(a + " " + eval(a)); // Logs hello world

Cela produira exactement la même sortie que:

console.log(a + " " + hello); // Logs hello world

(L'exemple est tiré du manuel PHP sur les variables variables .)

Abraham Murciano Benzadon
la source