javascript - 根据条件删除数组元素

IT技术 javascript
2021-02-20 15:58:52

我想知道如何在 javascript 中实现一种方法,该方法删除清除某个条件的数组的所有元素。(最好不使用 jQuery)

前任。

ar = [ 1, 2, 3, 4 ];
ar.removeIf( function(item, idx) {
    return item > 3;
});

上面的代码将遍历数组中的每个项目并删除所有return true满足条件的项目(在示例中,项目 > 3)。

我刚开始使用 javascript,想知道是否有人知道一种简短有效的方法来完成这项工作。

——更新——

如果条件也适用于对象属性,那就太好了。

前任。

ar = [ {num:1, str:"a"}, {num:2, str:"b"}, {num:3, str:"c"} ];
ar.removeIf( function(item, idx) {
    return item.str == "c";
});

如果该项目将被删除 item.str == "c"

--更新 2 --

如果索引条件也能正常工作,那就太好了。

前任。

ar = [ {num:1, str:"a"}, {num:2, str:"b"}, {num:3, str:"c"} ];
ar.removeIf( function(item, idx) {
    return idx == 2;
});
6个回答

您可以使用数组过滤器方法

代码如下所示:

ar = [1, 2, 3, 4];
ar = ar.filter(item => !(item > 3));
console.log(ar) // [1, 2, 3]

如果你翻译!(item > 3)成人类语言,它会是item <= 3
2021-04-16 15:58:52
@Rudey,不错的收获!
2021-04-27 15:58:52
请记住,Array.filter 方法会创建一个新数组。如果您在另一个变量中引用您的数组,则此后引用将被破坏: ar1 = [1, 2, 3, 4]; ar2 = ar1; ar1 = ar1.filter(item => !(item > 3)); console.log(ar1); console.log(ar2);
2021-05-01 15:58:52
@Miha_x64 在 JavaScript 中,!(item > 3)item <= 3. 如果该数组包含undefined项目,!(item > 3)则为真,而item <= 3为假。
2021-05-15 15:58:52

如果对您Array不起作用,您可以添加自己的方法来做类似的事情filter

Array.prototype.removeIf = function(callback) {
    var i = 0;
    while (i < this.length) {
        if (callback(this[i], i)) {
            this.splice(i, 1);
        }
        else {
            ++i;
        }
    }
};

对我来说,这是 JavaScript 最酷的特性之一。伊恩指出了一种更有效的方法来做同样的事情。考虑到它是 JavaScript,每一点都有帮助:

Array.prototype.removeIf = function(callback) {
    var i = this.length;
    while (i--) {
        if (callback(this[i], i)) {
            this.splice(i, 1);
        }
    }
};

这避免了甚至担心更新length或捕获下一个项目的需要,因为您向左而不是向右工作。

@Ian 我倾向于更喜欢可读性,但您的解决方案肯定更有效。我还添加了索引作为第二个参数(最初只是忽略了它,因为它没有被使用,我认为他不需要它)。
2021-04-29 15:58:52
那有点乱。尝试jsfiddle.net/n8JEy/4 - 你没有i作为第二个参数传递给回调
2021-05-05 15:58:52
改变预定义类的原型是有风险的。应该只以 polyfill-ish 方式完成,即添加已经在规范中声明但尚未被浏览器实现的成员。感谢您的解决方案,我将其用作本地功能。
2021-05-08 15:58:52
@dk123 作为 JavaScript 的新手,您可以自由控制此类回调的参数,只要您认为合适,只要信息可用,您就可以向它们添加任何您想要的内容(例如,您可以添加当前数组的长度使用this.length作为第三个参数,如果你有一些倾向)。
2021-05-13 15:58:52
谢谢,效果很好。我喜欢这在迭代过程中如何通过拼接来考虑索引的变化。
2021-05-15 15:58:52

您可以使用Array.filter(),它的作用相反:

ar.filter(function(item, idx) {
    return item <= 3;
});
创建一个新数组Array.filter可能比手动拼接给定数组更快。
2021-04-25 15:58:52
Array.filter() 不返回一个带有过滤元素的新数组吗?有什么东西可以从数组中删除元素吗?
2021-05-01 15:58:52
@dk123:没有任何预制的东西。你必须写一个for循环。,
2021-05-01 15:58:52
@Blender 这很有趣。我发誓我最近刚刚研究了一些比较两者的东西,结果恰恰相反。删除我的愚蠢评论。感谢您提供证据:)
2021-05-09 15:58:52
作为 IE8 或更低版本不支持的提示。您还应该否定原始表达式,或者它应该是<=.
2021-05-10 15:58:52

您可以使用lodash.remove

var array = [1, 2, 3, 4];
var evens = _.remove(array, function(n) {
  return n % 2 == 0;
});

console.log(array);
// => [1, 3]

console.log(evens);
// => [2, 4]

使其成为具有箭头功能的单线:

ar = ar.filter(i => i > 3);