如何从数组中删除元素

How can I remove elements from an array?

本文关键字:删除 元素 数组      更新时间:2024-03-30

我正在开发一个类似多页绘画的应用程序,有一个"清除"按钮。当用户按下该按钮时,我希望该页面上绘制的所有形状都被清除。以下是清除按钮后面的代码。

clear.addEventListener('click', function (e) {
        canvas.width = canvas.width;
        tempCanvas.width = tempCanvas.width;
        var tempShapes = shapes.slice();
        alert(tempShapes.length);
        for(var i=0; i<tempShapes.length; i++)
        {
            var A = tempShapes[i];
            if(A.pageNum == pNum)
            {
                alert('in');
                shapes.splice(i, 1);
            }
        }
        //shapes.length = 0;
        e.preventDefault();
    }

shapes[]是包含所有页面的完整对象的数组。我只想删除当前页码(pNum)的那些。当代码运行时,它会在该特定页面的形状数组中留下一个元素,有时还会留下两个元素。我希望删除该特定页面的形状数组的所有元素。

您可能会发现Array.filter对该任务更有用,比如:

shapes = shapes.filter(function(shape, i) {
    return tempShapes[i].pageNum != pnum;
})

问题是删除第一个元素后,数组索引不同步

orig : 0-0, 1-1, 2-2 
temp : 0-0, 1-1, 2-2
remove orig[0] -> index 0 -> temp[0] = 0
orig : 0-0, 1-1, 2-2 
temp : 0-1, 1-2
remove orig[1] -> index 1 -> temp[1] = 2 !!

您可以从正在迭代的同一数组中删除:

clear.addEventListener('click', function (e) {
    for(var i=shapes.length-1; i>=0; i--) {
        if(shapes[i].pageNum == pNum) {
            shapes.splice(i, 1);
        }
    }
    e.preventDefault();
}

或者你可以过滤它们:

clear.addEventListener('click', function (e) {
    shapes = shapes.filter(function(item) { return item.pageNum != pNum });
    e.preventDefault();
}