Использовать имена динамических переменных в JavaScript

Ответ 1

Поскольку ECMA-/Javascript - это все Objects и Contexts (которые также являются некоторыми объектами Object), каждая переменная хранится в такой переменной Variable - (или в случае Функция, Объект активации).

Итак, если вы создаете такие переменные:

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

В Глобальной области (= NO function context) вы неявно записываете эти переменные в Глобальный объект (= window в браузере).

К ним можно получить доступ с помощью обозначения "точка" или "скобка":

var name = window.a;

или

var name = window['a'];

Это работает только для глобального объекта в этом конкретном экземпляре, потому что Объект переменной Глобального объекта - это сам объект window. Внутри контекста функции у вас нет прямого доступа к объекту активации. Например:

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

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

new foobar();

new создает новый экземпляр самоопределяемого объекта (контекста). Без new область действия функции также будет global (= window). В этом примере можно было бы предупредить undefined и 1 соответственно. Если бы мы заменили this.a = 1; this.b = 2 на:

var a = 1,
    b = 2;

Оба выходных сигнала тревоги будут undefined. В этом случае переменные a и b будут храниться в объекте активации из foobar, к которому мы не можем получить доступ (конечно, мы могли бы получить доступ к ним напрямую, вызывая a и b).

Ответ 2

eval - один из вариантов.

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

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

Ответ 3

Вы можете использовать объект окна, чтобы добраться до него.

window['myVar']

window имеет ссылку на все глобальные переменные и глобальные функции, которые вы используете.

Ответ 4

Просто не знаю, что плохой ответ получает так много голосов. Это довольно простой ответ, но вы делаете его сложным.

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

Попробуйте это...

Ответ 6

Это пример:

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

Итак, значение "coco" myVariable становится переменной coco.

Поскольку все переменные в глобальной области являются свойствами объекта Window.

Ответ 7

В 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"]);

Ответ 8

Если вы не хотите использовать глобальный объект, например window или global (node), вы можете попробовать что-то вроде этого:

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

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

Ответ 9

Мне нужно было нарисовать несколько FormData "на лету" и объектный способ работал хорошо

var forms = {}

Затем в моих циклах мне нужно было создать данные формы, которые я использовал

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

Ответ 10

2019

TL; DR

• Оператор eval может запускать строковое выражение в вызываемом им контексте и возвращать переменные из этого контекста;
• literal object теоретически может сделать это записью: {[varName]}, но он заблокирован по определению.

Поэтому я сталкиваюсь с этим вопросом, и все здесь просто играют, не предлагая реального решения. но у @Axel Heider хороший подход.

Решение 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 }'

Ответ 11

что они означают, нет, вы не можете. нет способа сделать это. так что вы могли бы сделать что-то вроде этого

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.

Ответ 12

eval() не работал в моих тестах. Но добавление нового кода JavaScript в дерево DOM возможно. Итак, вот функция, которая добавляет новую переменную:

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

использовать объект тоже здорово.

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

Ответ 14

Хотя у этого есть принятый ответ, я хотел бы добавить наблюдение:

В ES6 использование let не работает:

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

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

Ответ 15

Это альтернатива для тех, кому нужно экспортировать переменную с динамическим именем

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];

Ответ 16

Лучше поздно, чем никогда!

Когда я столкнулся с той же проблемой, я спросил себя:

x = 'lo Wor' ;

y = 'Hel' + x + 'ld' ; // Hello World

Отсюда следует, что

x = 'MyTxtBx' ;

y = document.getElementById(''+x+'').value ; //Those are two single quotes, not double quotes