Javascript 返回索引的负数

Javascript returns negative number for index

本文关键字：索引 返回 Javascript      更新时间：2023-09-26

当我在javascript中执行onclick函数时获取负值

  function sun()
        {
            var d,i;
            var t = document.getElementById("table");
            var rows = t.getElementsByTagName("tr");
            for (i = 0; i < rows.length; i++) {
               console.log("inside............." + i);
               rows[i].onclick = function() {
               d = (this.rowIndex);
               console.log(d);
            };
          }
      }

虽然我不确定是什么导致了你注意到的确切问题，但你在这里遇到了一个非常常见的JavaScript陷阱，在循环中使用闭包（匿名函数）。JavaScript 与许多其他支持函数式编程的语言一样，具有一个方便的属性，即函数可以在创建时围绕它们可见的任何变量"关闭范围"。因此，正如您在那里所做的那样，您可以在函数中使用 d（或i）的值，只要它在声明函数时可以看到它们。

但是，循环

中发生了一些有趣的事情：您在循环中创建的每个函数共享相同的范围，这意味着它们都共享完全相同的d和i副本。因此，当您单击任何行时，d 和 i 的值将是它们在循环结束时的值，而不是您要定位的特定迭代。

这通常使用称为"生成器模式"的东西来修复，您可以在其中创建一个单独的函数，该函数返回在所需范围内关闭的新函数。例如，在代码中，您可以执行类似操作

function generateClickHandler(i, d) {
    return function() {
        d = (this.rowIndex);
        console.log(d);
    };
}
function sun()
{
    var d,i;
    var t = document.getElementById("table");
    var rows = t.getElementsByTagName("tr");
    for (i = 0; i < rows.length; i++) {
        console.log("inside............." + i);
        rows[i].onclick = generateClickHandler(i, d);
    }
}

新函数generateClickHandler返回函数本身，但这里要注意的重要一点是，返回的函数关闭了本地参数i和d，而不是循环中使用的共享i和d值 - 当您调用generateClickHandler时，它们的值会被复制。这样，您的代码就不会受到奇怪的闭包效果的影响。

相关文章：