Javascript 当$.each和array.splice（i）保持在一起时，JQuery处理数组索引外错误

最近我在互联网上搜索一些可以处理废弃的ajax/xhr调用的代码

:

这段代码运行得很好，但其中有一行让我感到困惑，我怀疑其中是否存在逻辑错误，但不知何故，它运行得很完美

下面是让我困惑的部分，

$(this).each(function (i, jqXHR) {
        $.xhrPool.splice(i, 1);
});

遍历for循环并获取第i个元素并将其从数组中移除

现在，随着第一个成员从数组中移除，数组的总长度减少，元素的索引也减少

然后在下一次迭代中，i的值增加，因此得到cougt的元素将不同（或者不符合预期）

例如考虑数组= [1,2，3，4，5，6，7，8，9，10]； 迭代1 迭代2 迭代3 迭代4 迭代5 迭代6 **麻烦来了

注意：我的计算机能够理解此代码并正确执行，但问题在于我的大脑，它还没有准备好接受此部分：-(

我相信$。每个人都是正确完成任务的人，但我仍然无法理解它是如何工作的。

代码“起作用”，但没有执行它应该执行的操作。该方法被称为

abortAll

，它确实中止了所有XHR，但只清除了数组的一半。它确实应该删除它中止的所有项，但它没有

jQuery

每个

都将获取数组的一个副本并进行迭代，因此我仍然会从0到（复制的）数组中的最后一个索引，即使从原始数组中删除了元素

但它仍然出错，因为

拼接

作用于原始数组，将元素移动到该数组中的前面索引。但另一方面，i不断增加，因此两个元素中就有一个在

拼接

后仍然存在

abortAll

可以更正为：

$.xhrPool.abortAll = function () {
    $(this).each(function (i, jqXHR) {
        jqXHR.abort();
        // the element to be deleted will always be at index 0 in the original array:
        $.xhrPool.splice(0, 1); 
    });
});

…但实际上，可以这样做：

$.xhrPool.abortAll = function () {
    $(this).each(function (i, jqXHR) {
        jqXHR.abort();
    });
    $.xhrPool.length = 0;
});

---

感谢您的回复。您的第二种方法有一个小小的缺点，它将重新初始化数组，因此abortAll方法将从数组中删除，并且我们将不得不再次重新初始化它以将该方法附加到数组中。事实上，我已更新了答案以避免重新初始化。现在它非常完美：）

array = [2,3,4,5,6,7,8,9,10]
i=1
removes 3
new array is [2,4,5,6,7,8,9,10]

array = [2,4,5,6,7,8,9,10]
i=2
removes 5
new array is [2,4,6,7,8,9,10]

array = [2,4,6,7,8,9,10]
i=3
removes 7
new array is [2,4,6,8,9,10]

array = [2,4,6,8,9,10]
i=4
removes 9
new array is [2,4,6,8,10]

array = [2,4,6,8,10]
i=5

$.xhrPool.abortAll = function () {
    $(this).each(function (i, jqXHR) {
        jqXHR.abort();
        // the element to be deleted will always be at index 0 in the original array:
        $.xhrPool.splice(0, 1); 
    });
});

$.xhrPool.abortAll = function () {
    $(this).each(function (i, jqXHR) {
        jqXHR.abort();
    });
    $.xhrPool.length = 0;
});