HOWTO · JavaScript
JavaScript 動態變數名
本教程介紹 JavaScript 動態變數名稱。它告訴我們它是什麼以及我們如何在 JavaScript 中使用動態變數名。
本頁內容
本教程是關於 JavaScript 動態變數名的，我們將在其中瞭解它的定義、建立和在 JavaScript 中的使用。我們不使用硬編碼動態變數，而是在程式執行期間自動生成。
我們可以使用 eval() 函式和 window 物件來學習 JavaScript 動態變數名稱。
eval() 是一個全域性物件的函式屬性，它執行表示為字串的 JavaScript 程式碼。
eval() 如果它的引數是一個表示式，則計算表示式，如果它的引數是一個或多個 JavaScript 語句，則執行語句。
eval() 也可以在未經你許可的情況下在應用程式中執行惡意程式碼。這樣，應用程式的範圍也對第三方可見，從而導致可能的攻擊。因此，除了學習目的之外，最好從不使用 eval。我們還可以使用 window 物件在 JavaScript 中建立動態變數。它是在我們的瀏覽器上執行的全域性物件。
讓我們通過示例程式碼來理解這兩種方式。
在 JavaScript 中使用 eval() 建立動態變數名
JavaScript 程式碼：
var j = 'item';
var i = 0;
for (i = 1; i < 5; i++) {
eval('var ' + j + i + '= ' + i + ';');
}
console.log('Item1 = ' + item1);
console.log('Item2 = ' + item2);
console.log('Item3 = ' + item3);
console.log('Item4 = ' + item4);
輸出：
"Item1 = 1"
"Item2 = 2"
"Item3 = 3"
"Item4 = 4"
在上面的程式碼中，我們使用 eval() 建立動態變數名稱，它執行宣告 item 並分配 i 的值的語句。
在 JavaScript 中使用 window 物件建立動態變數名
JavaScript 中的一切都是 Context（一種物件）和 Object。在函式的情況下，每個變數都儲存在 Variable 或 Activation Object 中。
我們可以在 Global Scope 中隱式寫入變數，等於瀏覽器中的 window，並且可以通過 bracket 或 dot 表示法訪問。
JavaScript 程式碼：
var num1 = 1, num2 = 2, num3 = 3;
var newNumberViaDot = window.num1;
var newNumberViaBracket = window['num1'];
console.log('Dynamic variable via dot notation');
console.log(newNumberViaDot);
console.log('Dynamic variable via bracket notation');
console.log(newNumberViaBracket);
輸出：
"Dynamic variable via dot notation"
1
"Dynamic variable via bracket notation"
1
上述建立動態變數名稱的技術僅適用於全域性物件。原因是全域性物件的變數物件是 window 物件本身。
我們無法訪問函式的 Context 中的 Activation Object。請參閱以下程式碼。
function numbersFunction() {
this.num1 = 1;
this.num2 = 2;
this.num3 = 3;
var newNumber = window['num1']; // === undefined
console.log(newNumber);
newNumber = this['num1']; // === 1
console.log(newNumber);
}
new numbersFunction();
輸出：
undefined
1
在上面給出的片段中，new 建立了 numberFunction() 的例項；沒有它，numberFunction() 的範圍將是全域性的，等於 window 物件。此示例列印 undefined 和 1。
