如何使用jQuery从数组中删除特定值
Posted
技术标签:
【中文标题】如何使用jQuery从数组中删除特定值【英文标题】：How to remove specific value from array using jQuery 【发布时间】：2011-04-05 11:54:22 【问题描述】：我有一个如下所示的数组：var y = [1, 2, 3];
我想从数组y 中删除2。
如何使用 jQuery 从数组中删除特定值？我试过pop()，但这总是会删除最后一个元素。
【问题讨论】：
警告：一些最受好评的答案可能会产生副作用，例如，当数组不包含要删除的元素时执行错误操作。 请小心使用。 在splice()和$.inArray()的使用下查看我的评论，我已经解决了这个问题，没有使用循环，而且很干净。 【参考方案1】：一个工作的JSFIDDLE
你可以这样做：
var y = [1, 2, 2, 3, 2]
var removeItem = 2;
y = jQuery.grep(y, function(value)
return value != removeItem;
);
结果：
[1, 3]
http://snipplr.com/view/14381/remove-item-from-array-with-jquery/
【讨论】：
这是个好消息，是的，需要正确的修改:) 我确实认为@user113716 回答，关于默认的JS 方法是正确的方法。任何本机方法都将始终是首选且速度更快。 这个答案不是完全错误的吗？它正在创建一个缺少项目的新数组，而不是从数组中删除一个项目。这些根本不是一回事。 这是一个复杂度为 O(n) 的移除...数组中的值越多，情况就越糟糕... O(n) 的复杂性不是问题。【参考方案2】：使用 jQuery，您可以像这样进行单行操作：
示例： http://jsfiddle.net/HWKQY/
y.splice( $.inArray(removeItem, y), 1 );
使用原生的.splice() 和jQuery 的$.inArray()。
【讨论】：
@Elankeeran - 不客气。 :o) 我应该注意，这只会删除第一个实例。如果有多个要删除，它就行不通了。 我还将 removeItem 更改为数组中不存在的值，并删除了数组中的最后一项。如果您不确定 removeItem 的存在，请使用此选项：y = $.grep(y, function (val) return val != removeItem ; ); 警告 - 可能会删除错误的项目！ $.inArray 如果值不存在则返回 -1 并且 .splice 将负索引视为“从末尾开始”，因此如果您尝试删除的值不存在，则会删除其他一些值。此外 $.grep 将删除所有出现，而此方法只会删除第一个。 要解决上述两个问题，请使用while 循环和像这样的临时变量：var found; while ((found = $.inArray(removeItem, y)) !== -1) y.splice(found, 1);
虽然使用 ES5 .indexOf() 而不是 jQuery 更好，因为您可以使用找到的最后一个索引作为下一次搜索的起点，这比每次搜索整个数组要高效得多。 var found=0; while ((found = y.indexOf(removeItem, found)) !== -1) y.splice(found, 1);【参考方案3】：
jQuery.filter 方法很有用。这适用于 Array 对象。
var arr = [1, 2, 3, 4, 5, 5];
var result = arr.filter(function(elem)
return elem != 5;
);//result -> [1,2,3,4]
http://jsfiddle.net/emrefatih47/ar0dhvhw/
在 Ecmascript 6 中：
let values = [1,2,3,4,5];
let evens = values.filter(v => v % 2 == 0);
alert(evens);
https://jsfiddle.net/emrefatih47/nnn3c2fo/
【讨论】：
似乎在建议的解决方案中发挥了最佳效果，即使它实际上并没有改变现有的阵列，而是创建一个新的阵列。它也适用于不存在的值或空数组。我在 JSFiddle 中进行了快速性能检查：使用具有 800.000 个值的数组大约需要 6 秒才能完成。不知道这是否很快。 这个解决方案是使用vanilla JS高阶函数过滤器，NOT jQuery过滤器方法。【参考方案4】：不是 jQuery 方式，而是... 为什么不使用更简单的方法。从以下数组中删除“c”
var a = ['a','b','c','d']
a.splice(a.indexOf('c'),1);
>["c"]
a
["a", "b", "d"]
你也可以使用：（我自己注意：Don’t modify objects you don’t own）
Array.prototype.remove = function(v) this.splice(this.indexOf(v) == -1 ? this.length : this.indexOf(v), 1);
var a = ['a','b','c'];
a.remove('c'); //value of "a" is now ['a','b']
添加更简单a.push('c')
【讨论】：
不起作用。如果未找到，则删除数组中的最后一项。 IE8-不支持indexOf。【参考方案5】：您可以使用underscore.js。它真的让事情变得简单。
在您的情况下，您必须编写的所有代码都是 -
_.without([1,2,3], 2);
结果将是 [1,3]。
它减少了您编写的代码。
【讨论】：
恕我直言_.without(2, [1,2,3]); 会是一个更好的设计。现在它看起来更像 yodascore.js【参考方案6】：
删除数组中的项目
var arr = ["jQuery", "javascript", "html", "Ajax", "Css"];
var itemtoRemove = "HTML";
arr.splice($.inArray(itemtoRemove, arr), 1);
【讨论】：
【参考方案7】：//This prototype function allows you to remove even array from array
Array.prototype.remove = function(x)
var i;
for(i in this)
if(this[i].toString() == x.toString())
this.splice(i,1)
使用示例
var arr = [1,2,[1,1], 'abc'];
arr.remove([1,1]);
console.log(arr) //[1, 2, 'abc']
var arr = [1,2,[1,1], 'abc'];
arr.remove(1);
console.log(arr) //[2, [1,1], 'abc']
var arr = [1,2,[1,1], 'abc'];
arr.remove('abc');
console.log(arr) //[1, 2, [1,1]]
要使用这个原型函数，您需要将它粘贴到您的代码中。 然后你可以将它应用到任何带有 'dot notation' 的数组：
someArr.remove('elem1')
【讨论】：
这里不会错过更多的解释！ 要使用这个原型函数，你需要将它粘贴到你的代码中。然后你可以将它应用到任何带有 'dot notation' 的数组中，例如： someArr.remove('elem1') 这样的唯一问题是它覆盖了全局 Array 对象的 remove 方法，这意味着项目中依赖于默认行为的任何其他代码最终都会出现错误行为。 另一个问题是全局变量i被覆盖了。【参考方案8】：
首先检查数组中是否存在元素
$.inArray(id, releaseArray) > -1
如果该元素存在于数组中，则返回该元素的索引，否则返回-1
releaseArray.splice($.inArray(id, releaseArray), 1);
如果找到，上面的行将从数组中删除该元素。总结下面的逻辑是检查和删除数组中的元素所需的代码。
if ($.inArray(id, releaseArray) > -1)
releaseArray.splice($.inArray(id, releaseArray), 1);
else
releaseArray.push(id);
【讨论】：
【参考方案9】：在 Javascript 中没有本地方法可以做到这一点。您可以使用库或编写一个小函数来代替：http://ejohn.org/blog/javascript-array-remove/
【讨论】：
【参考方案10】：你可以像这样使用 .not 函数：
var arr = [ 1 , 2 , 3 , 5 , 8];
var searchValue = 2;
var newArr = $(arr).not([searchValue]).get();
【讨论】：
如果该值不在其中，这将清除整个数组，因此 searchValue = 4 将返回一个空白数组。 我已经将代码复制到jsfiddle中，将searchValue改为4，运行代码，没有检测到问题。所有值仍然存在。@JulianK【参考方案11】：
//in case somebody needs something like this: multidimensional array (two items)
var ar = [[0,'a'],[1,'b'],[2,'c'],[3,'d'],[4,'e'],[5,'f']];
var removeItem = 3;
ar = jQuery.grep(ar, function(n)
return n[0] != removeItem; //or n[1] for second item in two item array
);
ar;
【讨论】：
【参考方案12】：我的 user113716 的回答版本。如果没有找到匹配项，他会删除一个值，这是不好的。
var y = [1, 2, 3]
var removeItem = 2;
var i = $.inArray(removeItem,y)
if (i >= 0)
y.splice(i, 1);
alert(y);
现在，如果找到匹配项，则删除 1 项，如果未找到匹配项，则删除 0。
它是如何工作的：
$.inArray(value, array) 是一个 jQuery 函数，它在array 中找到 value 的第一个索引
如果未找到该值，则上述返回 -1，因此在我们进行删除之前检查 i 是否为有效索引。删除索引 -1 意味着删除最后一个，这在这里没有帮助。
.splice(index, count) 删除从index 开始的count 值的数量，所以我们只需要count 的1
【讨论】：
【参考方案13】：这里第二个最受好评的答案是最接近 OP 想要的预期行为的单行 jQuery 方法，但他们在代码末尾绊倒了，而且它有一个缺陷。如果要删除的项实际上不在数组中，则最后一项将被删除。
有些人注意到了这个问题，有些人提供了循环的方法来防止这个问题。我提供了我能找到的最短、最干净的方法，并且我在他们的答案下评论了根据这种方法修复代码的方法。
var x = [1, 2, "bye", 3, 4];
var y = [1, 2, 3, 4];
var removeItem = "bye";
// Removing an item that exists in array
x.splice( $.inArray(removeItem,x), $.inArray(removeItem,x) ); // This is the one-liner used
// Removing an item that DOESN'T exist in array
y.splice( $.inArray(removeItem,y), $.inArray(removeItem,y) ); // Same usage, different array
// OUTPUT -- both cases are expected to be [1,2,3,4]
alert(x + '\n' + y);
数组x 将轻松删除元素“bye”，数组y 将不受影响。
使用参数$.inArray(removeItem,array) 作为第二个参数实际上最终是要拼接的长度。由于未找到该项目，因此计算结果为 array.splice(-1,-1);，这只会导致没有任何内容被拼接...所有这些都无需为此编写循环。
【讨论】：
您应该测试您的代码：jsfiddle.net/nw2eosk6 它不起作用。 “存在于数组中”的情况返回 [1,2,4] 如果“再见”是元素 0，似乎不起作用。我猜 0 的计算结果为false？【参考方案14】：
有一个简单的拼接解决方案。根据W3School拼接语法如下；
array.splice(index, howmany, item1, ....., itemX)
索引 必需。一个整数，指定在什么位置添加/删除项目，使用负值指定距离数组末尾的位置
多少必填。要删除的项目数。如果设置为 0，则不会删除任何项目
item1, ..., itemX 可选。要添加到数组中的新项目
请记住，如果找到，以下 js 将从给定数组中弹出一个或多个匹配项，否则不会删除数组的最后一项。
var x = [1,2,3,4,5,4,4,6,7];
var item = 4;
var startItemIndex = $.inArray(item, x);
var itemsFound = x.filter(function(elem)
return elem == item;
).length;
或者
var itemsFound = $.grep(x, function (elem)
return elem == item;
).length;
所以最终应该如下所示
x.splice( startItemIndex , itemsFound );
希望这会有所帮助。
【讨论】：
【参考方案15】：我有一个类似的任务，我需要根据数组中对象的属性一次删除多个对象。
所以经过几次迭代后，我最终得到：
list = $.grep(list, function (o) return !o.IsDeleted );
【讨论】：
【参考方案16】：我会用 pick_and_remove() 函数扩展 Array 类，如下所示：
var ArrayInstanceExtensions =
pick_and_remove: function(index)
var picked_element = this[index];
this.splice(index,1);
return picked_element;
;
$.extend(Array.prototype, ArrayInstanceExtensions);
虽然看起来有点冗长，但您现在可以在您可能需要的任何数组上调用 pick_and_remove()！
用法：
array = [4,5,6] //=> [4,5,6]
array.pick_and_remove(1); //=> 5
array; //=> [4,6]
您可以在以口袋妖怪为主题的动作here.中看到所有这些
【讨论】：
【参考方案17】：/** SUBTRACT ARRAYS **/
function subtractarrays(array1, array2)
var difference = [];
for( var i = 0; i < array1.length; i++ )
if( $.inArray( array1[i], array2 ) == -1 )
difference.push(array1[i]);
return difference;
然后您可以在代码中的任何位置调用该函数。
var I_like = ["love", "sex", "food"];
var she_likes = ["love", "food"];
alert( "what I like and she does't like is: " + subtractarrays( I_like, she_likes ) ); //returns "Naughty :P"!
这在所有情况下都有效，并避免了上述方法中的问题。希望对您有所帮助！
【讨论】：
【参考方案18】：试试这个对我有用
_clientsSelected = ["10", "30", "12"];
function (removeItem)
console.log(removeItem);
_clientsSelected.splice($.inArray(removeItem, _clientsSelected), 1);
console.log(_clientsSelected);
`enter code here`,
【讨论】：
【参考方案19】：使用原生 JavaScript 从数组中安全删除 2：
// Define polyfill for browsers that don't natively support Array.indexOf()
if (!Array.prototype.indexOf)
Array.prototype.indexOf = function(searchElement, fromIndex)
var k;
if (this===null)
throw new TypeError('"this" is null or not defined');
var O = Object(this),
len = O.length >>> 0;
if (len===0) return -1;
var n = +fromIndex || 0;
if (Math.abs(n)===Infinity) n = 0;
if (n >= len) return -1;
k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);
while (k < len)
if (k in O && O[k]===searchElement) return k;
++k;
return -1;
;
// Remove first instance of 2 from array
if (y.indexOf(2) > -1)
y.splice(y.indexOf(2), 1);
/* To remove all instances of 2 from array, change 'if' to 'while':
while (y.indexOf(2) > -1)
y.splice(y.indexOf(2), 1);
*/
console.log(y); // Returns [1, 3]
Polyfill 来源：Mozilla
【讨论】：
【参考方案20】：只是补充一下 Sarfraz 的答案，很惊讶还没有人把它变成一个函数。
如果您的数组中有多次相同的值，请使用 .filter 方法使用 ddagsan 的答案。
function arrayRemoveVal(array, removeValue)
var newArray = jQuery.grep(array, function(value) return value != removeValue;);
return newArray;
var promoItems = [1,2,3,4];
promoItems = arrayRemoveVal(promoItems, 3);// removes 3
console.log(promoItems);
promoItems = arrayRemoveVal(promoItems, 3);// removes nothing
console.log(promoItems);<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>【讨论】：
以上是关于如何使用jQuery从数组中删除特定值的主要内容，如果未能解决你的问题，请参考以下文章
如何从javascript或jquery中的元素数组中删除特定元素
如何从javascript或jquery中的元素数组中删除特定元素
如何删除 cookie 数组 Laravel 8 中的特定值