JavaScript splice() 迭代时未定义索引

Question

这个问题已经有答案了:

Looping through array and removing items, without breaking for loop (17 个回答)

已关闭 7 年前。

我正在尝试根据条件从数组中删除项目。

var Stack  = {};

Stack.items = [];

Stack.items.push({
    id: '123',
    name: 'Lorem ipsum dolor sit.'
});

Stack.items.push({
    id: '154',
    name: 'Lorem ipsum dolor sit.'
});

Stack.items.push({
    id: '123',
    name: 'Lorem ipsum dolor sit.'
});

现在，我将删除所有 ID 为 154 的项目。

$.each(Stack.items, function(index, item) {
    // console.log( item.id );
    // console.log( index);
    if( item.id === '154' ) {
        Stack.items.splice(index, 1);
    }
});

但是我在第二次迭代中遇到了未定义的错误。我认为这是因为 splice() 函数修改了原始数组，因此索引被更改

Uncaught TypeError: Cannot read property 'id' of undefined

我使用 lodash 得到了预期的结果，但我试图不只是为了解决这个问题而使用它们

_.remove(Stack.items, function(item) {
    return item.id === '123';
});

谢谢!!

Answer 1

如果您必须需要就地修改，您将需要使用另一种方法。仅当元素未被删除时，您的索引才必须递增。一个例子是:

var index = 0;
while ( index < Stack.items.length ) {
    var item = Stack.items[index];
    if ( item.id === '154' )
        Stack.items.splice(index, 1);
    else
        index++;
}

但是，创建数组的副本并使用它将使代码更容易理解，并且编码速度更快:

var newItems = Stack.items.filter(function(item) {
    return item.id !== '154';
});