Javascript函数数组删除项目

Question

我有 Javascript 过滤项目类和数组，如下所示

function FilterItem(filterId, filterType) {
    this.filterId = filterId;
    this.filterType = filterType;
}

var filterItemArray = [];

我正在向此数组添加过滤项，如下所示

function AddFilterItem(filterId, filterType) {
    filterItemArray.push(new FilterItem(filterId, filterType));
}

我还需要通过特定的filterId

从此数组中删除项目

function RemoveFilterItem(filterId, filterType) {
    var item = new filterItem(filterId, filterType);
    var itemIndex = jQuery.inArray(item, filterItemArray);
}

但这不起作用，我不认为这是有效的方式？我的问题是在RemoveFilterItem方法

中删除此项目的最佳方法是什么

Answer 1

为什么不使用原生filter函数：

function RemoveFilterItem(filterId, filterType) {    
    filterItemArray = filterItemArray.filter(function (el) {
        return el.filterId !== filterId && el.filterType !== filterType;
    });
}

这将为您提供不带该id和类型的元素的数组。

DEMO

这是Manwal的答案的修改版本，但没有再次使用jQuery：

function RemoveFilterItem(filterId, filterType) {
    for (var i = 0, l = filterItemArray.length; i < l; i++) {
        var el = filterItemArray[i];
        if (el.filterId === filterId && el.filterType === filterType) {
            filterItemArray.splice(i, 1);

            // because we're caching the length of the array
            // we need to adjust the length of l once the splice has taken place
            l--;
        }
    }
}

DEMO

Answer 2

Andy's answer有效，但您可以make it a lot faster使用Array.splice。 Manwal's answer使用拼接但如果有重复的过滤器则会失败。

我也会使用OO代码而不是全局函数。

function FilterItem(filterId, filterType) {
    this.filterId = filterId;
    this.filterType = filterType;
}

function FilterItems() {
    this.items = [];
}

FilterItems.prototype.add = function (filterId, filterType) {
    this.items.push(new FilterItem(filterId, filterType));
}

FilterItems.prototype.remove = function (filterId, filterType) {
    for (var i = this.items.length - 1; i >=0 ; i--) {
        var item = this.items[i];
        if (item.filterId === filterId && item.filterType === filterType) {
            this.items.splice(i, 1);
        }    
    }
}

var filters = new FilterItems();
filters.add(1, 1);
filters.add(2, 2);
// Adding two filters of the same type/id to prove that it can remove
// multiple items
filters.add(1, 1);

filters.remove(1, 1);

console.log(filters.items.length);
console.log(filters.items[0]);

Answer 3

您可以使用$.each迭代数组的每个元素，然后splice：

function RemoveFilterItem(filterId, filterType) {    
    var item = new FilterItem(filterId, filterType);
    $.each(filterItemArray, function( index, value){
        if(value.filterId == item.filterId){
            filterItemArray.splice(index,1);
        }
    });   
}

See it in action

删除时无需创建新的FilterItem：

function RemoveFilterItem(filterId, filterType) {    
    $.each(filterItemArray, function( index, value){
        if(value.filterId === filterId && value.filterType === filterType){
            filterItemArray.splice(index,1);
        }
    });   
}

See Updated Demo