javascript - onclick 依赖于 for 循环的 i 值。如何删除它？

Question

我正在用 JavaScript 编写一个简单的计算器。我有 0 到 9、+、-、*、/、= 和 C 的按钮用于清除。我想为每个按钮的 onclick 分配事件处理程序。由于 0 到 9 的按钮具有非常相似的事件处理程序，因此我使用了一个 for 循环来分配给每个按钮的 onclick：

/* one, two, three, etc. are variables defined earlier.
 *
 * for example,
 * var one = document.getElementById("one");
 * where that element is a button that says "1"
 *
 * the "display" element is the calculator display
 */
var num_array = [one, two, three, four, five,
                 six, seven, eight, nine, zero];
for (var i = 0; i < num_array.length; ++i) {
    num_array[i].onclick = function() {
        document.getElementById("display").value += num_array[i].value;
    };
}

但这不起作用，因为 onclick 的事件处理程序依赖于 i，一旦 for 循环完成，它将始终为 10。有什么方法可以消除对 i 的依赖，同时保持我的代码简洁（即使用 for 循环）？我不想为每个单独的按钮写出事件处理程序。

Answer 1

为什么不直接使用this代替num_array[i]？

for (var i = 0; i < num_array.length; ++i) {
    num_array[i].onclick = function() {
        document.getElementById("display").value += this.value;
    };
}

this将指向被点击的元素。