问题
In PHP you can do amazing/horrendous things like this:
$a = 1;
$b = 2;
$c = 3;
$name = \'a\';
echo $$name;
// prints 1
Is there any way of doing something like this with Javascript?
E.g. if I have a var name = \'the name of the variable\'; can I get a reference to the variable with name name?
回答1:
Since ECMA-/Javascript is all about Objects and Contexts (which, are also somekind of Object), every variable is stored in a such called Variable- (or in case of a Function, Activation Object).
So if you create variables like this:
var a = 1,
b = 2,
c = 3;
In the Global scope (= NO function context), you implicitly write those variables into the Global object (= window in a browser).
Those can get accessed by using the "dot" or "bracket" notation:
var name = window.a;
or
var name = window['a'];
This only works for the global object in this particular instance, because the Variable Object of the Global Object is the window object itself. Within the Context of a function, you don't have direct access to the Activation Object. For instance:
function foobar() {
this.a = 1;
this.b = 2;
var name = window['a']; // === undefined
alert(name);
name = this['a']; // === 1
alert(name);
}
new foobar();
new creates a new instance of a self-defined object (context). Without new the scope of the function would be also global (=window). This example would alert undefined and 1 respectively. If we would replace this.a = 1; this.b = 2 with:
var a = 1,
b = 2;
Both alert outputs would be undefined. In that scenario, the variables a and b would get stored in the Activation Object from foobar, which we cannot access (of course we could access those directly by calling a and b).
回答2:
eval is one option.
var a = 1;
var name = 'a';
document.write(eval(name)); // 1
回答3:
You can use the window object to get at it .
window['myVar']
window has a reference to all global variables and global functions you are using.
回答4:
Just don't know what a bad answer gets so many votes. It's quite easy answer but you make it complex.
// 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);
回答5:
a = 'varname';
str = a+' = '+'123';
eval(str)
alert(varname);
Try this...
回答6:
This is an example :
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
Another example :
var myVariable = 'coco';
window[myVariable] = 'riko';
alert(coco); // display : riko
So, the value "coco" of myVariable becomes a variable coco.
Because all the variables in the global scope are properties of the Window object.
回答7:
In Javascript you can use the fact that all properties are key value pairs. jAndy already mentioned this but I don't think his answer show how it can be exploited.
Usually you are not trying to create a variable to hold a variable name but are trying to generate variable names and then use them. PHP does it with $$var notation but Javascript doesn't need to because property keys are interchangeable with array keys.
var id = "abc";
var mine = {};
mine[id] = 123;
console.log(mine.abc);
gives 123. Usually you want to construct the variable which is why there is the indirection so you can also do it the other way around.
var mine = {};
mine.abc = 123;
console.log(mine["a"+"bc"]);
回答8:
If you don't want to use a global object like window or global (node), you can try something like this:
var obj = {};
obj['whatever'] = 'There\'s no need to store even more stuff in a global object.';
console.log(obj['whatever']);
回答9:
2019
TL;DR
evaloperator can run string expression in the context it called and return variables from that context;literal objecttheoretically can do that by write:{[varName]}, but it blocked by definition.
So I come across this question and everyone here just play around without bringing a real solution. but @Axel Heider has a good approaching.
The solution is eval.
almost most forgotten operator. ( think most one is with() )
eval operator can dynamically run expression in the context it called. and return the result of that expression. we can use that to dynamically return a variable's value in function's context.
example:
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
Note that I always write explicitly the expression eval will run.
To avoid unnecessary surprises in the code. eval is very strong
But I'm sure you know that already
BTW, if it was legal we could use literal object to capture the variable name and value, but we can’t combine computed property names and property value shorthand, sadly, is invalid
functopn example( varName ){
var var1 = 'foo', var2 ='bar'
var capture = {[varName]}
}
example('var1') //trow 'Uncaught SyntaxError: Unexpected token }`
回答10:
I needed to draw multiple FormData on the fly and object way worked well
var forms = {}
Then in my loops whereever i needed to create a form data i used
forms["formdata"+counter]=new FormData();
forms["formdata"+counter].append(var_name, var_value);
回答11:
what they mean is no, you can't. there is no way to get it done. so it was possible you could do something like this
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();
}
having a create function just like the one implemented in ECMAScript 5.
回答12:
eval() did not work in my tests. But adding new JavaScript code to the DOM tree is possible. So here is a function that adds a new variable:
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)
回答13:
Although this have an accepted answer I would like to add an observation:
In ES6 using let doesn't work:
/*this is NOT working*/
let t = "skyBlue",
m = "gold",
b = "tomato";
let color = window["b"];
console.log(color);However using var works
/*this IS working*/
var t = "skyBlue",
m = "gold",
b = "tomato";
let color = window["b"];
console.log(color);I hope this may be useful to some.
回答14:
use Object is great too.
var a=123
var b=234
var temp = {"a":a,"b":b}
console.log(temp["a"],temp["b"]);
回答15:
This is an alternative for those who need to export a dynamically named variable
export {
[someVariable]: 'some value',
[anotherVariable]: 'another value',
}
// then.... import from another file like this:
import * as vars from './some-file'
Another alternative is to simply create an object whose keys are named dynamically
const vars = { [someVariable]: 1, [otherVariable]: 2 };
// consume it like this
vars[someVariable];
来源：https://stackoverflow.com/questions/5117127/use-dynamic-variable-names-in-javascript