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。