在JavaScript中使用动态变量名

在PHP中,你可以做这样惊人/可怕的事情:

$a = 1;
$b = 2;
$c = 3;
$name = 'a';
echo $$name;
// prints 1

有什么方法可以用Javascript做这样的事情吗?

例如,如果我有一个var name = 'the name of the variable';,我可以得到一个引用的变量名称name?

665545 次浏览

您可以使用窗口对象来获取它。

window['myVar']

window有一个你正在使用的所有全局变量和全局函数的引用。

eval是一个选项。

var a = 1;
var name = 'a';


document.write(eval(name)); // 1

警告:注意,如果你不知道你在做什么,不建议使用eval()函数,因为它会带来多重安全问题。除非绝对必要,否则使用其他东西。更多信息见MDN页面进行评估

由于ECMA-/Javascript都是关于ObjectsContexts(它们也是某种对象)的,所以每个变量都存储在这样的变量,中(如果是函数,则存储在激活对象中)。

如果你创建这样的变量:

var a = 1,
b = 2,
c = 3;

全局作用域 (= NO函数上下文)中,您隐式地将这些变量写入全局对象(在浏览器中= window)。

这些可以通过“。”来访问。或“;bracket"符号:

var name = window.a;

var name = window['a'];

这只适用于这个特定实例中的全局对象,因为全局对象变量对象window对象本身。在函数的上下文中,你不能直接访问激活对象. conf。例如:

function foobar() {
this.a = 1;
this.b = 2;


var name = window['a']; // === undefined
console.log(name);
name = this['a']; // === 1
console.log(name);
}


new foobar();

new创建一个自定义对象(context)的新实例。如果没有new,函数的作用域也是global (=window)。这个例子将分别提醒undefined1。如果我们将this.a = 1; this.b = 2替换为:

var a = 1,
b = 2;

两个警报输出都是未定义的。在这种情况下,变量ab将从foobar存储在激活对象中,我们不能访问(当然,我们可以通过调用ab直接访问它们)。

a = 'varname';
str = a+' = '+'123';
eval(str)
alert(varname);

试试这个…

他们的意思是不,你不能。 没有办法完成它。 所以你可以这样做

function create(obj, const){
// where obj is an object and const is a variable name
function const () {}


const.prototype.myProperty = property_value;
// .. more prototype


return new const();


}

有一个创建函数,就像在ECMAScript 5中实现的那样。

Eval()在我的测试中不起作用。但是可以向DOM树中添加新的JavaScript代码。这里有一个函数,它添加了一个新变量:

function createVariable(varName,varContent)
{
var scriptStr = "var "+varName+"= \""+varContent+"\""


var node_scriptCode = document.createTextNode( scriptStr )
var node_script = document.createElement("script");
node_script.type = "text/javascript"
node_script.appendChild(node_scriptCode);


var node_head = document.getElementsByTagName("head")[0]
node_head.appendChild(node_script);
}


createVariable("dynamicVar", "some content")
console.log(dynamicVar)

在Javascript中,你可以使用所有属性都是键值对这一事实。jAndy已经提到了这一点,但我不认为他的回答显示了它是如何被利用的。

通常情况下,你不是试图创建一个变量来保存变量名,而是试图生成变量名,然后使用它们。PHP使用$$var标记,但Javascript不需要这样做,因为属性键可以与数组键互换。

var id = "abc";
var mine = {};
mine[id] = 123;
console.log(mine.abc);

给了123。通常你想要构造变量这就是为什么有间接的原因所以你也可以用另一种方式来做。

var mine = {};
mine.abc = 123;
console.log(mine["a"+"bc"]);

只是不知道为什么一个糟糕的答案能得到这么多票。这个答案很简单,但你把它弄复杂了。

// If you want to get article_count
// var article_count = 1000;
var type = 'article';
this[type+'_count'] = 1000;  // in a function we use "this";
alert(article_count);

这是一个例子:

for(var i=0; i<=3; i++) {
window['p'+i] = "hello " + i;
}


alert(p0); // hello 0
alert(p1); // hello 1
alert(p2); // hello 2
alert(p3); // hello 3

另一个例子:

var myVariable = 'coco';
window[myVariable] = 'riko';


alert(coco); // display : riko

因此,myVariable的值“椰子树”变成了变量椰子树

因为全局作用域中的所有变量都是Window对象的属性。

如果你不想使用像window或global (node)这样的全局对象,你可以尝试这样做:

var obj = {};
obj['whatever'] = 'There\'s no need to store even more stuff in a global object.';


console.log(obj['whatever']);

我需要绘制多个FormData在飞行和对象的方式工作得很好

var forms = {}

然后在我的循环中,无论我需要创建一个表格数据我使用

forms["formdata"+counter]=new FormData();
forms["formdata"+counter].append(var_name, var_value);

2019

博士TL;

  • eval操作符可以在它调用的上下文中运行字符串表达式,并从该上下文中返回变量;
  • literal object理论上可以通过write:{[varName]}来实现,但它被定义阻塞。

所以我遇到这个问题,这里的每个人都只是玩玩,没有提出真正的解决方案。但是@阿克塞尔·海德有一个很好的接近。

答案是eval。 几乎是最被遗忘的运算符。(认为大多数是with())

eval操作符可以在它调用的上下文中动态运行表达式。并返回该表达式的结果。我们可以使用它在函数的上下文中动态返回变量的值。

例子:

function exmaple1(){
var a = 1, b = 2, default = 3;
var name = 'a';
return eval(name)
}


example1() // return 1




function example2(option){
var a = 1, b = 2, defaultValue = 3;


switch(option){
case 'a': name = 'a'; break;
case 'b': name = 'b'; break;
default: name = 'defaultValue';
}
return eval (name);
}


example2('a') // return 1
example2('b') // return 2
example2() // return 3
注意,我总是显式地写表达式eval将运行。 避免代码中出现不必要的意外。eval是非常强的 但我相信你已经知道了

顺便说一句,如果这是合法的,我们可以使用literal object来捕获变量名和值,但我们不能将计算的属性名和属性值简写结合起来,遗憾的是,这是无效的

functopn example( varName ){
var var1 = 'foo', var2 ='bar'


var capture = {[varName]}


}


example('var1') //trow 'Uncaught SyntaxError: Unexpected token }`

使用Object也很棒。

var a=123
var b=234
var temp = {"a":a,"b":b}
console.log(temp["a"],temp["b"]);

虽然这有一个公认的答案,但我想补充一个观察:

在ES6中使用let 不工作:

/*this is NOT working*/
let t = "skyBlue",
m = "gold",
b = "tomato";


let color = window["b"];
console.log(color);

然而,使用var 作品

/*this IS working*/
var t = "skyBlue",
m = "gold",
b = "tomato";


let color = window["b"];
console.log(color);

我希望这对一些人有用。

对于那些需要导出动态命名变量的人来说,这是一种替代方法

export {
[someVariable]: 'some value',
[anotherVariable]: 'another value',
}


// then.... import from another file like this:
import * as vars from './some-file'

另一种方法是简单地创建一个对象,其键是动态命名的

const vars = { [someVariable]: 1, [otherVariable]: 2 };


// consume it like this
vars[someVariable];

最好使用创建名称空间并在其中声明变量,而不是将其添加到全局对象。我们还可以创建一个函数来获取和设置值

请看下面的代码片段:

//creating a namespace in which all the variables will be defined.
var myObjects={};


//function that will set the name property in the myObjects namespace
function setName(val){
myObjects.Name=val;
}


//function that will return the name property in the myObjects namespace
function getName(){
return myObjects.Name;
}


//now we can use it like:
setName("kevin");
var x = getName();
var y = x;
console.log(y)  //"kevin"
var z = "y";
console.log(z); //"y"
console.log(eval(z)); //"kevin"

以类似的方式,我们可以声明和使用多个变量。虽然这将增加代码行数,但代码将更健壮,更不容易出错。

这将做你在php中所做的事情:

var a = 1;
var b = 2;
var ccc = 3;
var name = 'a';
console.log( window[name] ); // 1

这是一个纯javascript解决方案,它不依赖于运行时环境的全局this。使用对象解构实现简单。

const dynamicVar = (nameValue, value) => {
const dynamicVarObj = {
[nameValue]: value
}
return dynamicVarObj;
}


const nameToUse = "myVar";
const value = 55;


const { myVar } = dynamicVar(nameToUse, value);


console.log(myVar); // prints 55

简单的解决方案:创建一个对象数组,每个对象都有两个字段(variableName,variableValue)

let allVariables = [];


for (let i = 0; i < 5; i++)
allVariables.push({ variableName: 'variable' + i, variableValue: i * 10 });


for (let i = 0; i < allVariables.length; i++)
console.log(allVariables[i].variableName + ' is ' + allVariables[i].variableValue);

输出:

variable0 is 0
variable1 is 10
variable2 is 20
variable3 is 30
variable4 is 40

console.log(allVariables) json:

 [
{
"variableName": "variable0",
"variableValue": 0
},
{
"variableName": "variable1",
"variableValue": 10
},
{
"variableName": "variable2",
"variableValue": 20
},
{
"variableName": "variable3",
"variableValue": 30
},
{
"variableName": "variable4",
"variableValue": 40
}
]