JavaScript 中的“变量”变量

"Variable" variables in JavaScript

提问人:ShoeLace1291 提问时间:3/4/2011 最后编辑:Peter MortensenShoeLace1291 更新时间:2/21/2023 访问量:100351

问:

我知道在PHP中可以有“可变”变量。例如

$x = "variable";
$$x = "Hello, World!";
echo $variable; // Displays "Hello, World!"

是否可以在 JavaScript 中按变量名称将变量称为字符串?这将如何完成?

JavaScript -变量

评论

0赞 Mister Jojo 12/6/2018
数组不是变量,如果你使用数组作为函数参数,JS解释器将使用指向数组的指针。在编程中,某些术语的使用是精确的,而你要求的只有很少的意义

答:

41赞 Masterbuddha 3/4/2011 #1

如果你迫切希望这样做,你可以尝试使用 eval():

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

或者使用 window 对象:

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

评论

2赞 Oriol 11/28/2016
eval无法在严格模式下创建局部变量。但是,间接调用可以创建全局变量。
177赞 Felix Kling 3/4/2011 #2

tl;dr:不要使用 eval

对此没有单一的解决方案。可以通过 动态访问一些全局变量,但这不适用于函数的局部变量。成为属性的全局变量是用 和 和 es 定义的变量。windowwindowletconstclass

几乎总是有比使用变量更好的解决方案!相反,您应该查看数据结构并为您的问题选择正确的结构。

如果您有一组固定的名称,例如

// BAD - DON'T DO THIS!!!
var foo = 42;
var bar = 21;

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

将这些名称/值存储为对象的属性,并使用括号表示法动态查找它们:

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

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

ES2015+ 中,使用简洁的属性表示法对现有变量执行此操作更加容易:

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

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


如果您有“连续”编号的变量,例如

// BAD - DON'T DO THIS!!!
var foo1 = 'foo';
var foo2 = 'bar';
var foo3 = 'baz';

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

然后,您应该改用数组,只需使用索引来访问相应的值:

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

评论

0赞 Thomas 4/22/2021
2021年在这方面已经变得毫无用处;至少在实际应用中是这样。即使您的 CSP 允许,我也不知道任何不通过某些压缩器运行的生产代码会弄乱您的变量名称。evaleval
0赞 Christian Vincenzo Traina 6/20/2022
eval不仅没用,而且在运行时已经被禁用了。许多框架默认启用了,所以我希望我们能看到它消失:)strict modestrict mode
4赞 Felix Kling 6/20/2022
@CristianTraìna:你在哪里读到在严格模式下被禁用的?事实并非如此。eval
2赞 Kamila Borowska 10/14/2012 #3

当然可以,但不要。变量必须是全局变量。

var killingFunction = 'alert'
var killMeNow = 'please'
var please = 'You have been killed!'
this[killingFunction](this[killMeNow])

2赞 lkdhruw 3/10/2014 #4
var vars = {};
var var_name = "str";
vars[var_name] = "working";
console.log(vars["str"]);
7赞 Awesomeness01 11/9/2014 #5

要在 JavaScript 中仅使用字符串引用变量,可以使用

window['your_variable_name']

您可以设置和引用变量,也可以设置和引用变量中的对象。

评论

1赞 ggorlen 7/7/2022
几乎总是,将其命名空间到一个对象中比在窗口上全局附加所有变量要好。为什么?作用域有助于包含错误,避免名称冲突,并使代码更易于理解。
-2赞 Abraham Murciano Benzadon 7/13/2017 #6

您可以使用 JavaScript eval(str) 函数。

此函数将提供的字符串转换为 JavaScript 代码,然后执行它。

例如:

eval("console.log('Hello, World!')"); // Logs hello world

因此,要将其用作变量变量,您可以执行以下操作:

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

这将产生与以下完全相同的输出:

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

(示例摘自 PHP 变量手册

5赞 Nadav 11/20/2017 #7

与 PHP 不同,JavaScript 不提供对全局数组(包含对当前声明的所有变量名称的引用)的访问。因此,JavaScript 不提供对变量变量的本机支持。但是,只要将所有变量定义为数组或对象的一部分,就可以模拟此功能。这反过来又会为你创建一个全局数组。例如,而不是像这样在全局范围内声明变量:hello

var hello = 'Hello, World!';

让我们将其封装在一个对象中。我们将该对象称为变量(变量):vv

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

现在我们可以通过变量的索引来引用变量,并且由于可以使用变量提供数组索引,因此我们实际上使用了变量变量:

console.log(vv[referToHello]); //Output: Hello, World!

问题的答案

让我们将其应用于您在原始问题中提供的代码:

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

实用性

虽然前面的代码可能看起来非常繁琐和不切实际,但在 JavaScript 中使用这种类型的封装的变量有实际用途。在下面的示例中,我们使用相同的概念来获取未定义数量的 HTML 元素的 ID。

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

此示例根据每个元素的 ID 声明变量变量(键),并将该元素的节点指定为每个变量的值。而且,由于通常不鼓励在 JavaScript 中使用全局变量,因此为您的变量变量提供一个唯一的作用域(在这种情况下,在数组中声明它们)不仅简洁,而且更负责任。elementIdselementIds

4赞 Jaber Al Nahian 5/5/2021 #8

您可以使用全局对象,或者:windowthis

window:

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

或者使用点:

var data = "anyVariableName";
window.data = 123;
alert(window.data); //123

这:

ar data = "anyVariableName";
this["temp_" + data] = 123;
alert(this["temp_" + data]); //123

或使用点

var data = "anyVariableName";
this.data = 123;
alert(this.data); //123

一个现实生活中的例子:

var tasksTableNameRandom = 'tasksTable_' + Math.random().toString(36).substr(2, 5);
console.log('Tasks Table Object name: ' + tasksTableNameRandom);
this.tasksTableNameRandom = $('#tasks-data-table').DataTable({
    ...
});

评论

1赞 Peter Mortensen 5/19/2021
但前提是它在 Web 浏览器中运行(?)。Node.js呢?
2赞 Christian Vincenzo Traina 3/17/2022
@PeterMortensen 在 nodeJs 中,有一个变量global
0赞 Danial 2/21/2023 #9

我用一个对象来做这件事。无需使用窗口:

var myVars = {};

let foo = "hello";
myVars[foo] = 100;
let bar = myVars[foo];

只需确保 myVars 是全局的。