我知道 PHP 中可能有 变量 ,人们可以通过存储在另一个变量中的名称来访问变量。 例如,
$x = "variable";
$$x = "Hello, World!";
echo $variable; // Displays "Hello, World!"
是否可以在 JavaScript 中执行相同的操作?怎么办?
tl;博士:不要使用
eval
!
对此没有单一的解决方案。可以通过 window
动态访问
some全局变量,但这不适用于函数的本地变量。 不成为
window
属性的全局变量是用let
和const
以及class
es定义的变量。
几乎总是有比使用可变变量更好的解决方案!相反,您应该查看数据结构并为您的问题选择正确的结构。
如果您有一组固定的名称,例如
// 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));
那么你应该使用 array 来代替,并简单地使用索引来访问相应的值:
// GOOD
var foos = ['foo', 'bar', 'baz'];
var index = 1;
console.log(foos[index - 1]);
如果你迫切希望这样做,你可以尝试使用 eval():
var data = "testVariable";
eval("var temp_" + data + "=123;");
alert(temp_testVariable);
或者使用窗口对象:
var data = "testVariable";
window["temp_" + data] = 123;
alert(window["temp_" + data]);
要在 JavaScript 中仅使用字符串引用变量,您可以使用
window['your_variable_name']
您也可以设置和引用变量以及变量中的对象。
与 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 声明可变变量(
elementIds
中的键),并将该元素的节点分配为每个变量的值。由于通常不鼓励在 JavaScript 中使用全局变量,因此为变量赋予唯一的作用域(在本例中,在 elementIds
数组内声明它们)不仅简洁,而且更负责任。
您可以使用 global
window
对象,或 this
:
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({
...
});
var vars = {};
var var_name = "str";
vars[var_name] = "working";
console.log(vars["str"]);
当然可以,但不要。变量必须是全局的。
var killingFunction = 'alert'
var killMeNow = 'please'
var please = 'You have been killed!'
this[killingFunction](this[killMeNow])
我用一个物体来做这个。无需使用窗户:
var myVars = {};
let foo = "hello";
myVars[foo] = 100;
let bar = myVars[foo];
只需确保 myVars 是全局的。
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 变量手册。)