Використовуйте імена динамічних змінних у JavaScript

У PHP ви можете робити такі дивовижні / жахливі речі:

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

Чи є якийсь спосіб зробити щось подібне з Javascript?

Наприклад, якщо я маю, чи var name = 'the name of the variable';можу я отримати посилання на змінну з ім'ям name?

Оскільки ECMA- / Javascript - це все про ( Objectsі Contextsякі також є деякимвидом Об'єкта), кожна змінна зберігається у такій, що називається змінною (або у випадку функції, об'єкта активації ).

Тож якщо ви створюєте такі змінні:

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

У глобальній області (= контекст функції NO) ви неявно записуєте ці змінні в об’єкт Global (= 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(= вікно). Цей приклад застереже undefinedі 1відповідно. Якщо ми замінимо this.a = 1; this.b = 2:

var a = 1,
    b = 2;

Обидва сигнали тривоги будуть невизначені. У такому сценарії змінні aі bзберігаються в об’єкті активації foobar, до якого ми не можемо отримати доступ (звичайно, ми могли отримати доступ до них безпосередньо за допомогою виклику aта b).

eval є одним із варіантів.

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

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

Ви можете використовувати об’єкт вікна, щоб потрапити на нього.

window['myVar']

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

Просто не знаю, яка погана відповідь набирає стільки голосів. Відповідь досить проста, але ви ускладните її.

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

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

Спробуйте це...

Це приклад:

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.

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

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дуже сильний але я впевнений, що ви це вже знаєте

BTW, якщо це було законно, ми могли б використовувати literal objectдля захоплення ім'я змінної та значення змінної, але ми не можемо поєднувати обчислені імена властивостей та скорочення значення властивості, на жаль, недійсне

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

    var capture = {[varName]}

}

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

Якщо ви не хочете використовувати такий глобальний об’єкт, як вікно або global (вузол), ви можете спробувати щось подібне:

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

Це альтернатива для тих, хто потребує експорту динамічно названої змінної

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

що вони означають - ні, ви не можете. немає способу зробити це. тож можна було зробити щось подібне

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 () не працював у моїх тестах. Але додати новий код 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)

Хоча на це є прийнята відповідь, я хотів би додати зауваження:

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

Я сподіваюся, що це може бути корисним для деяких.

використання Об'єкт теж великий.

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