자바 스크립트의 "변수"변수?


101

PHP에서 "변수"변수를 가질 수 있다는 것을 알고 있습니다. 예를 들면

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

javascript에서 이름으로 변수를 문자열로 참조 할 수 있습니까? 어떻게 될까요?


배열은 변수가 아닙니다. 배열을 함수 인수로 사용하면 JS 인터프리터는 배열에 대한 포인터를 사용합니다. 프로그램에서 특정 용어의 사용은 정확하고, 당신을 위해 무엇을 물어 만 거의 의미가
미스터 조조

답변:


147

이에 대한 단일 솔루션은 없습니다 (글쎄요 eval,하지만 심각하게 고려하지 않겠습니다). 를 통해 일부 전역 변수에 동적으로 액세스 할 수 window있지만 함수에 로컬 인 변수에는 작동하지 않습니다. 속성 이되지 않는 전역 변수는 및 , 및 es로 window정의 된 변수 입니다.letconstclass

변수 변수를 사용하는 것보다 거의 항상 더 나은 솔루션이 있습니다! 대신 데이터 구조를 살펴보고 문제에 맞는 구조 를 선택 해야합니다 .

다음과 같이 고정 된 이름 집합이있는 경우

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


여러 값을 정의하는 예 : var x = 1; var x, y = 2; x = 1; var x = 1, y = 2; var x = xx = 1; var y = x + x;
Amin Maleki

42

이 작업을 필사적으로 수행하려면 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


evalStrict 모드에서는 지역 변수를 만들 수 없습니다. 그러나 간접 호출은 전역 변수를 만들 수 있습니다.
Oriol 2016

4

문자열만으로 자바 스크립트에서 변수를 참조하려면 다음을 사용할 수 있습니다.

window['your_variable_name']

변수 및 변수의 개체도 설정하고 참조 할 수 있습니다.


4

PHP와 달리 JavaScript는 현재 선언 된 모든 변수 이름에 대한 참조를 포함하는 전역 배열에 대한 액세스를 제공하지 않습니다. 따라서 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의 변수 변수에 대한 실용적인 용도가 있습니다. 아래 예에서 정의되지 않은 수의 HTML 요소의 ID를 얻기 위해 동일한 개념을 사용합니다.

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배열 내에서 선언 )를 지정하는 것이 좋지 않기 때문에 깔끔 할뿐만 아니라 책임감도 더 높습니다.


2

물론 가능하지만 불가능합니다. 변수는 전역이어야합니다.

var killingFunction = 'alert'
var killMeNow = 'please'
var please = 'You have been killed!'
this[killingFunction](this[killMeNow])

2
var vars = {};
var var_name = "str";
vars[var_name] = "working";
console.log(vars["str"]);

0

JavaScript eval(str)기능을 사용할 수 있습니다 .

이 함수가하는 일은 제공된 문자열을 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 매뉴얼에서 가져온 것입니다 .)

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.