Cómo eliminar un valor específico de la matriz usando jQuery

419

Tengo una matriz que se ve así: var y = [1, 2, 3];

Me gustaría eliminar 2de la matriz y.

¿Cómo puedo eliminar un valor particular de una matriz usando jQuery? Lo he intentado pop()pero eso siempre elimina el último elemento.

Elankeeran
fuente
8
ADVERTENCIA : algunas de las respuestas más votadas pueden tener efectos secundarios, por ejemplo, realizar operaciones incorrectas cuando la matriz no contiene el elemento que se va a eliminar. Úselos con cuidado .
Ricardo
Esta respuesta funcionó para mí, con javascript simple: stackoverflow.com/a/5767357/4681687
chimos
vea mi comentario bajo el uso de splice () y $ .inArray (), he resuelto este problema SIN el uso de un bucle, y está limpio.
user253780

Respuestas:

619

Un JSFIDDLE que funciona

Puedes hacer algo como esto:

var y = [1, 2, 2, 3, 2]
var removeItem = 2;

y = jQuery.grep(y, function(value) {
  return value != removeItem;
});

Resultado:

[1, 3]

http://snipplr.com/view/14381/remove-item-from-array-with-jquery/

Sarfraz
fuente
2
Esa es una buena noticia y sí, se necesitaba la modificación correcta :)
Sarfraz
2
Creo que la respuesta @ user113716, con respecto al método JS predeterminado, es la forma correcta. Cualquier método nativo siempre será preferido y más rápido.
neoswf
114
¿No es esta respuesta completamente incorrecta? Está creando una nueva matriz con un elemento faltante, no eliminando un elemento de la matriz. Esos no son lo mismo en absoluto.
James Moore
55
Esa es una eliminación con una complejidad de O (n) ... cuantos más valores en la matriz, peor será ...
Lyth
2
La complejidad de O (n) no es un problema.
Omar Tariq
370

Con jQuery, puede hacer una operación de una sola línea como esta:

Ejemplo: http://jsfiddle.net/HWKQY/

y.splice( $.inArray(removeItem, y), 1 );

Usa el nativo .splice() y jQuery's $.inArray().

usuario113716
fuente
13
@Elankeeran - De nada. : o) Debo señalar que esto eliminará solo la primera instancia. Si hay varios que eliminar, no funcionaría.
user113716
77
También cambié removeItem a un valor que NO existe en la matriz y eliminó el último elemento de la matriz. Use esto si no está seguro de la existencia del elemento eliminado: y = $ .grep (y, function (val) {return val! = RemoveItem;});
Solburn
52
ADVERTENCIA - ¡Puede eliminar el artículo incorrecto! $ .inArray devuelve -1 si el valor no está presente y .splice trata un índice negativo como 'desde el final', por lo que si el valor que está tratando de eliminar no está presente, se eliminará algún otro valor. También $ .grep eliminará todas las ocurrencias, mientras que este método solo eliminará el primero.
Ryan Williams el
1
Para solucionar los dos problemas descritos anteriormente, use un whilebucle y una variable temporal como esta:var found; while ((found = $.inArray(removeItem, y)) !== -1) y.splice(found, 1);
1
Aunque es mucho mejor con ES5 en .indexOf()lugar de jQuery porque puede usar el último índice encontrado como punto de partida para la próxima búsqueda, que es mucho más eficiente que buscar en toda la matriz cada vez. var found=0; while ((found = y.indexOf(removeItem, found)) !== -1) y.splice(found, 1);
51

jQuery.filterEl método es útil. Esto está disponible para Arrayobjetos.

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/

En Ecmascript 6:

let values = [1,2,3,4,5];
let evens = values.filter(v => v % 2 == 0);
alert(evens);

https://jsfiddle.net/emrefatih47/nnn3c2fo/

ddagsan
fuente
44
Parece que funciona mejor con las soluciones propuestas, a pesar de que en realidad no está alterando la matriz existente, sino creando una nueva. También funciona con valores no existentes o una matriz vacía. Comprobación rápida del rendimiento en JSFiddle que hice: con una matriz con 800,000 valores tardó aproximadamente 6 segundos en completarse. Aunque no estoy seguro si eso es rápido.
Flo
2
Esta solución está utilizando el filtro de función de orden superior JS de vainilla, NO el método de filtro jQuery.
Kalimah
¡Me encanta! Parece la mejor solución a pesar de que no es jquery ...
Sam
36

Puedes usar underscore.js . Realmente hace las cosas simples.

En su caso, todo el código que tendrá que escribir es:

_.without([1,2,3], 2);

y el resultado será [1,3].

Reduce el código que escribes.

vatsal
fuente
34

No es una forma jQuery pero ... ¿Por qué no usar una forma más simple? Eliminar 'c' de la siguiente matriz

var a = ['a','b','c','d']
a.splice(a.indexOf('c'),1);
>["c"]
a
["a", "b", "d"]

También puede usar: (Nota para mí: no modifique objetos que no le pertenecen )

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']

Agregar es más simplea.push('c')

Aamir Afridi
fuente
99
No funciona Elimina el último elemento de la matriz si no se encuentra.
Timothy Aaron
77
indexOf no es compatible con IE8-.
Boude
1
Funcionó perfectamente, gracias.
Jay Momaya
22

Eliminar elemento en matriz

var arr = ["jQuery", "JavaScript", "HTML", "Ajax", "Css"];
var itemtoRemove = "HTML";
arr.splice($.inArray(itemtoRemove, arr), 1);
praveen d
fuente
14
//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)
        }
    }
}

Ejemplo de uso

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]]

Para utilizar esta función prototipo, debe pegarla en su código. Luego puede aplicarlo a cualquier matriz con 'notación de puntos':

someArr.remove('elem1')
yesnik
fuente
¡Un poco más de explicación no pasaría por alto aquí!
Gaz Winter
Para utilizar esta función prototipo, debe pegarla en su código. Luego puede aplicarlo a cualquier matriz con 'notación de puntos', por ejemplo: someArr.remove ('elem1')
yesnik
3
El único problema con algo como esto es que sobrescribe el método de eliminación del objeto Array global, lo que significa que cualquier otro código en el proyecto que dependa del comportamiento predeterminado termina con un comportamiento defectuoso.
jmort253
2
Otro problema es que la variable global ise sobrescribe.
Roland Illig
5

Puede usar .not funciona así:

var arr = [ 1 , 2 , 3 , 5 , 8];
var searchValue = 2;

var newArr = $(arr).not([searchValue]).get();
Vahid Khakestani
fuente
2
Esto eliminará toda la matriz si el valor no está allí, por lo que searchValue = 4 devolverá una matriz en blanco.
Julian K
3
Copié el código en jsfiddle, cambié searchValuea 4, ejecuté el código, no se detectó ningún problema. Todos los valores todavía estaban presentes. @ JulianK
RST
4

Mi versión de la respuesta del usuario113716. Su elimina un valor si no se encuentra ninguna coincidencia, lo que no es bueno.

var y = [1, 2, 3]
var removeItem = 2;

var i = $.inArray(removeItem,y)

if (i >= 0){
    y.splice(i, 1);
}

alert(y);

Esto ahora elimina 1 elemento si se encuentra una coincidencia, 0 si no se encuentran coincidencias.

Cómo funciona:

  • $ .inArray (value, array) es una función jQuery que encuentra el primer índice de un value en unarray
  • Lo anterior devuelve -1 si no se encuentra el valor, así que verifique que sea un índice válido antes de realizar la eliminación. Eliminar el índice -1 significa eliminar el último, lo que no es útil aquí.
  • .splice (índice, número) elimina countnúmero de valores a partir de index, por lo que sólo queremos una countde las1
andrewb
fuente
3
//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;
Marijan Vukcevich
fuente
3

Hay una solución simple con empalme. De acuerdo con W3School, la sintaxis de empalme es la siguiente;

array.splice(index, howmany, item1, ....., itemX)

índice requerido. Un número entero que especifica en qué posición agregar / eliminar elementos. Utilice valores negativos para especificar la posición desde el final de la matriz.

cuántos requerido. El número de elementos que se eliminarán. Si se establece en 0, no se eliminarán elementos.

item1, ..., itemX Opcional. Los nuevos elementos que se agregarán a la matriz

Tenga en cuenta que los siguientes js mostrarán uno o más elementos coincidentes de la matriz dada si se encuentran, de lo contrario no eliminarían el último elemento de la matriz.

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;

O

var itemsFound = $.grep(x, function (elem) {
                              return elem == item;
                           }).length;

Entonces la final debería verse como la siguiente

x.splice( startItemIndex , itemsFound );

Espero que esto ayude.

Mahib
fuente
3

Primero verifica si el elemento existe en la matriz

$.inArray(id, releaseArray) > -1

la línea anterior devuelve el índice de ese elemento si existe en la matriz; de lo contrario, devuelve -1

 releaseArray.splice($.inArray(id, releaseArray), 1);

ahora arriba de la línea eliminará este elemento de la matriz si se encuentra. Para resumir, la lógica a continuación es el código requerido para verificar y eliminar el elemento de la matriz.

  if ($.inArray(id, releaseArray) > -1) {
                releaseArray.splice($.inArray(id, releaseArray), 1);
            }
            else {
                releaseArray.push(id);
            }
Luqman Cheema
fuente
2

Tuve una tarea similar en la que necesitaba eliminar varios objetos a la vez en función de una propiedad de los objetos en la matriz.

Entonces, después de algunas iteraciones, termino con:

list = $.grep(list, function (o) { return !o.IsDeleted });
Bogdan Litescu
fuente
2

Extendería la clase Array con una pick_and_remove()función, así:

var ArrayInstanceExtensions = {
    pick_and_remove: function(index){
        var picked_element = this[index];
        this.splice(index,1);
        return picked_element;
    } 
};
$.extend(Array.prototype, ArrayInstanceExtensions);

Si bien puede parecer un poco detallado, ¡ahora puede recurrir pick_and_remove()a cualquier matriz que desee!

Uso:

array = [4,5,6]           //=> [4,5,6]
array.pick_and_remove(1); //=> 5
array;                    //=> [4,6]

Puedes ver todo esto en acción con temática de pokemon aquí.

Starkers
fuente
2
/** 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;
}  

Luego puede llamar a la función en cualquier parte de su código.

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"!

Esto funciona en todos los casos y evita los problemas en los métodos anteriores. ¡Espero que ayude!

Kareem
fuente
2

Prueba esto, me funciona

_clientsSelected = ["10", "30", "12"];
function (removeItem) {
console.log(removeItem);
   _clientsSelected.splice($.inArray(removeItem, _clientsSelected), 1);
   console.log(_clientsSelected);
`enter code here`},
Baptiste Baume
fuente
2

La segunda respuesta más votada aquí está en la pista más cercana posible a un método jQuery de una línea del comportamiento deseado que el OP quiere, pero tropezaron al final de su código, y tiene una falla. Si su elemento a eliminar no está realmente en la matriz, se eliminará el último elemento.

Algunos han notado este problema, y ​​algunos han ofrecido formas de recorrer para protegerse de esto. Ofrezco el método más corto y limpio que pude encontrar, y he comentado en su respuesta la forma de corregir su código de acuerdo con este método.

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);

La matriz x eliminará el elemento "adiós" fácilmente, y la matriz y quedará intacta.

El uso del argumento $.inArray(removeItem,array)como segundo argumento en realidad termina siendo la longitud para empalmar. Dado que no se encontró el elemento, esto se evalúa como array.splice(-1,-1);, lo que simplemente dará como resultado que no se empalme nada ... todo sin tener que escribir un bucle para esto.

usuario253780
fuente
1

Para eliminar de forma segura 2 de la matriz usando JavaScript vainilla:

// 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]

Fuente de Polyfill: Mozilla

Thdoan
fuente
0

Solo para agregar a la respuesta de Sarfraz, sorprendido de que nadie lo haya convertido en una función todavía.

Use la respuesta de ddagsan usando el método .filter si tiene el mismo valor más de una vez en su matriz.

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>

Bim
fuente