ตัวแปร“ Variable” ใน Javascript?

ฉันรู้ว่าเป็นไปได้ใน PHP ที่จะมีตัวแปร "ตัวแปร" ตัวอย่างเช่น

$x = "variable";
$$x = "hello, world!";
echo $variable; // displays "hello, world!"

เป็นไปได้หรือไม่ที่จะอ้างถึงตัวแปรโดยใช้ชื่อเป็นสตริงในจาวาสคริปต์ มันจะทำอย่างไร?

ไม่มีทางออกเดียวสำหรับสิ่งนี้ (ดีมีevalแต่อย่าพิจารณาอย่างจริงจัง) เป็นไปได้ที่จะเข้าถึงตัวแปรส่วนกลางบางตัวแบบไดนามิกผ่านทางwindowแต่ใช้ไม่ได้กับตัวแปรภายในกับฟังก์ชัน ตัวแปรระดับโลกที่ไม่ได้กลายเป็นทรัพย์สินของwindowตัวแปรกำหนดด้วยletและconstและclassES

เกือบจะมีทางออกที่ดีกว่าการใช้ตัวแปรตัวแปร! แต่คุณควรดูโครงสร้างข้อมูลและเลือกโครงสร้างที่เหมาะสมกับปัญหาของคุณ

หากคุณมีชุดชื่อคงที่เช่น

// BAD
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
var foo1 = 'foo';
var foo2 = 'bar';
var foo3 = 'baz';

var index = 1;
console.log(eval('foo' + index));

จากนั้นคุณควรใช้อาร์เรย์แทนและใช้ดัชนีเพื่อเข้าถึงค่าที่เกี่ยวข้อง:

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

http://www.hiteshagrawal.com/javascript/dynamic-variables-in-javascript

ซึ่งแตกต่างจาก PHP คือ JavaScript ไม่ได้ให้การเข้าถึงอาร์เรย์ globals (ซึ่งมีการอ้างอิงถึงชื่อตัวแปรทั้งหมดที่ประกาศในปัจจุบัน) ด้วยเหตุนี้ JavaScript จึงไม่ให้การสนับสนุนดั้งเดิมสำหรับตัวแปรตัวแปร อย่างไรก็ตามคุณสามารถเลียนแบบคุณลักษณะนี้ได้ตราบเท่าที่คุณกำหนดตัวแปรทั้งหมดของคุณให้เป็นส่วนหนึ่งของอาร์เรย์หรือวัตถุ สิ่งนี้จะสร้างอาร์เรย์ gloabls ให้คุณ ตัวอย่างเช่นแทนที่จะประกาศตัวแปร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 โดยใช้การห่อหุ้มประเภทนี้ในทางปฏิบัติ ในตัวอย่างด้านล่างเราใช้แนวคิดเดียวกันเพื่อรับ ID ขององค์ประกอบ HTML ที่ไม่ได้กำหนดจำนวน

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

ตัวอย่างนี้ประกาศตัวแปรตัวแปร (คีย์ในelementIds) ตาม ID ของแต่ละองค์ประกอบและจะกำหนดโหนดขององค์ประกอบดังกล่าวเป็นค่าของตัวแปรแต่ละตัว และเนื่องจากโดยทั่วไปการใช้ตัวแปรส่วนกลางใน JavaScript จึงไม่สนับสนุนให้ตัวแปรตัวแปรของคุณมีขอบเขตที่ไม่ซ้ำกัน (ในกรณีนี้การประกาศภายในelementIdsอาร์เรย์) จึงไม่เพียง แต่เรียบร้อย แต่ยังมีความรับผิดชอบมากขึ้นด้วย

หากต้องการอ้างอิงตัวแปรใน javascript ด้วยสตริงเท่านั้นคุณสามารถใช้

window['your_variable_name']

คุณสามารถตั้งค่าและอ้างอิงตัวแปรและอ็อบเจกต์ในตัวแปรได้เช่นกัน

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

คุณสามารถใช้eval(str)ฟังก์ชันJavaScript

สิ่งที่ฟังก์ชั่นนี้คือการแปลงสตริงที่ให้มาเป็นรหัส JS จากนั้นเรียกใช้งาน

ตัวอย่างเช่น:

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 เกี่ยวกับตัวแปรตัวแปร )