Remova o objeto da matriz usando JavaScript


549

Como posso remover um objeto de uma matriz? Desejo remover o objeto que inclui o nome Kristiande someArray. Por exemplo:

someArray = [{name:"Kristian", lines:"2,5,10"},
             {name:"John", lines:"1,19,26,96"}];

Eu quero alcançar:

someArray = [{name:"John", lines:"1,19,26,96"}];


3
Para sua informação, revirei a edição desta pergunta para que a sintaxe da matriz esteja incorreta novamente e todas essas respostas estejam em contexto.
Dunhamzzz

2
E a sintaxe da matriz foi "corrigida" (duas vezes) novamente, para que as respostas não estejam mais no contexto.
25415 Teepeemm

4
Como o erro de sintaxe ajuda a fazer algumas respostas fazerem sentido?
Samy Bencherif

1
@SamyBencherif - Algumas das respostas abordam explicitamente o erro de sintaxe na versão original da pergunta; portanto, se você remover esse erro de sintaxe, essas respostas agora estão falando sobre algo que não existe.
Nnnnnn

Respostas:


778

Você pode usar vários métodos para remover itens de uma matriz:

//1
someArray.shift(); // first element removed
//2
someArray = someArray.slice(1); // first element removed
//3
someArray.splice(0, 1); // first element removed
//4
someArray.pop(); // last element removed
//5
someArray = someArray.slice(0, a.length - 1); // last element removed
//6
someArray.length = someArray.length - 1; // last element removed

Se você deseja remover o elemento na posição x, use:

someArray.splice(x, 1);

Ou

someArray = someArray.slice(0, x).concat(someArray.slice(-x));

Resposta ao comentário de @ chill182 : você pode remover um ou mais elementos de uma matriz usando Array.filterou Array.splicecombinado com Array.findIndex(consulte MDN ), por exemplo

// non destructive filter > noJohn = John removed, but someArray will not change
let someArray = getArray();
let noJohn = someArray.filter( el => el.name !== "John" ); 
log("non destructive filter > noJohn = ", format(noJohn));
log(`**someArray.length ${someArray.length}`);

// destructive filter/reassign John removed > someArray2 =
let someArray2 = getArray();
someArray2 = someArray2.filter( el => el.name !== "John" );
log("", "destructive filter/reassign John removed > someArray2 =", 
  format(someArray2));
log(`**someArray2.length ${someArray2.length}`);

// destructive splice /w findIndex Brian remains > someArray3 =
let someArray3 = getArray();
someArray3.splice(someArray3.findIndex(v => v.name === "Kristian"), 1);
someArray3.splice(someArray3.findIndex(v => v.name === "John"), 1);
log("", "destructive splice /w findIndex Brian remains > someArray3 =", 
  format(someArray3));
log(`**someArray3.length ${someArray3.length}`);

// Note: if you're not sure about the contents of your array, 
// you should check the results of findIndex first
let someArray4 = getArray();
const indx = someArray4.findIndex(v => v.name === "Michael");
someArray4.splice(indx, indx >= 0 ? 1 : 0);
log("", "check findIndex result first > someArray4 (nothing is removed) > ",
  format(someArray4));
log(`**someArray4.length (should still be 3) ${someArray4.length}`);

function format(obj) {
  return JSON.stringify(obj, null, " ");
}

function log(...txt) {
  document.querySelector("pre").textContent += `${txt.join("\n")}\n`
}

function getArray() {
  return [ {name: "Kristian", lines: "2,5,10"},
           {name: "John", lines: "1,19,26,96"},
           {name: "Brian", lines: "3,9,62,36"} ];
}
<pre>
**Results**

</pre>


2
@ Klemzy você não quis dizer não por índice? por valor ...?
precisa saber é o seguinte

328
A pergunta original perguntou como remover o objeto com o nome = "Kristian" da matriz. Sua resposta assume que é o primeiro item da matriz, mas e se Kristin não estiver no primeiro item? Então sua resposta não funciona.
Rochelle C

7
@ chill182: não é uma resposta específica, mas mais geral. A partir dele, você deve conseguir inferir o método para remover elementos. Se você deseja remover o elemento na posição x ... pode ser uma dica para remover outros que não sejam os primeiros, certo?
KooiInc 17/10

6
A função de emenda foi útil para mim, mas você não deveria ter reatribuído someArray. Isso resultará em algumaArray contendo o item removido, em vez de conter a matriz resultante com o item removido.
quer

1
Você deve verificar o findIndexresultado antes de usá-lo splice. Se não houver elementos na matriz que correspondam à condição findIndex, retornará -1e colocar isso diretamente spliceresultará em uma exclusão arbitrária do último elemento da matriz.
jdnz 19/02

131

Eu recomendo usar lodash.js ou sugar.js para tarefas comuns como esta:

// lodash.js
someArray = _.reject(someArray, function(el) { return el.Name === "Kristian"; });

// sugar.js
someArray.remove(function(el) { return el.Name === "Kristian"; });

na maioria dos projetos, ter um conjunto de métodos auxiliares fornecidos por bibliotecas como essas é bastante útil.


13
Eu acho que o exemplo de sublinhado está um pouco errado. Deveria sersomeArray = _.reject(someArray, function(el) { return el.Name === "Kristian"; });
Andy Ford

7
Se você não quiser usar underscore.js ou sugar.js, poderá fazer isso #someArray = someArray.filter(function(e) { return e.Name !== "Kristian"; });
BenR

1
Outra coisa que eu quero, haverá botões separados para cada objeto na matriz. se eu quiser excluir esse objeto em particular no botão da matriz clicou. como fazer isso . Eu usei js angular ng-repeat para gerar itens. você pode me ajudar
Thilak Raj

5
Indo contra o grão aqui; sugerir que se inclua uma biblioteca inteira com o objetivo simples de remover itens de objetos (que js suporta de maneira limpa e imediata, como mostra a resposta aceita) é uma forma ruim. Ele adiciona peso e complexidade desnecessários ao seu código, a menos que você já precise dele para obter a funcionalidade mais poderosa que a biblioteca fornece.
Josh Doebbert

4
Para uma operação simples, eu nunca recomendaria para incluir biblioteca
Munna Bhakta

130

A solução limpa seria usar Array.filter:

var filtered = someArray.filter(function(el) { return el.Name != "Kristian"; }); 

O problema disso é que ele não funciona no IE <9. No entanto, você pode incluir código de uma biblioteca Javascript (por exemplo, underscore.js ) que implementa isso em qualquer navegador.


10
Este, porém, irá remover todas as ocorrências encontradas, não apenas o primeiro
Flavien Volken

4
E retornará uma nova matriz em vez de modificar a original. Dependendo do caso de uso, isso pode ou não ser o que você deseja.
Jochie Nabuurs

1
@JochieNabuurs é realmente uma nova matriz. No entanto, o objeto permanece o mesmo. Você ainda pode modificar o valor de cada objeto e ele refletirá no objeto da matriz original.
DriLLFreAK100 23/01/19

2
Ao ponto de retornar uma nova matriz, basta alterar a solução para someArray = someArray.filter(function(el) { return el.Name != "Kristian"; }); endereços que, não?
hBrent 11/02/19

93

Que tal agora?

$.each(someArray, function(i){
    if(someArray[i].name === 'Kristian') {
        someArray.splice(i,1);
        return false;
    }
});

8
Isso não causará um erro, porque $.each()armazena em cache o comprimento da matriz antes de fazer o loop, por isso, se você remover um elemento, $.each()será executado no final da matriz (agora mais curta). (Então someArray[i]será undefinede undefined.nameirá falhar.)
nnnnnn

5
Em seguida, adicione um 'retorno falso' após a emenda.
Allan Taylor

18
isto não é javascript. -1
onionpsy 26/10/2015

20
Observe que esta resposta requer jQuery
Clarkey 4/16

68

Sua "matriz", como mostrado, é uma sintaxe JavaScript inválida. Os colchetes {}são para objetos com pares de nome / valor de propriedade, mas os colchetes []são para matrizes - assim:

someArray = [{name:"Kristian", lines:"2,5,10"}, {name:"John", lines:"1,19,26,96"}];

Nesse caso, você pode usar o .splice()método para remover um item. Para remover o primeiro item (índice 0), diga:

someArray.splice(0,1);

// someArray = [{name:"John", lines:"1,19,26,96"}];

Se você não conhece o índice, mas deseja pesquisar na matriz para encontrar o item com o nome "Kristian" para remover, é possível:

for (var i =0; i < someArray.length; i++)
   if (someArray[i].name === "Kristian") {
      someArray.splice(i,1);
      break;
   }

EDIT: Acabei de perceber que sua pergunta está marcada com "jQuery", para que você possa tentar o $.grep()método :

someArray = $.grep(someArray,
                   function(o,i) { return o.name === "Kristian"; },
                   true);

Por que eles adicionaram a sobrecarga? Certamente você poderia ter colocado! = "Kristian". Para que serve a sobrecarga?
markthewizard1234

@ markthewizard1234 - Você quer dizer o argumento booleano "inverter" $.grep()? Isso não adiciona muito neste exemplo, onde sim, eu poderia ter colocado !=, mas em outros casos você já pode ter uma função definida que faz o teste oposto ao que você deseja saudar, então, em vez de definir um função adicional, você pode simplesmente usar essa sobrecarga para inverter os resultados.
Nnnnnn 14/10

Ah, então se você tivesse uma função de wrapper contendo o grep, poderia definir o booleano como parâmetro. Entendi obrigado!
markthewizard1234

@ markthewizard1234 - Você poderia, mas não era isso que eu tinha em mente: imagine que você tinha function isEven(num) { return num%2===0 }. Você pode usar $.grep(someArray, isEven)para obter apenas os números pares da matriz ou $.grep(someArray, isEven, true)fazer o oposto e obter os valores pares.
Nnnnnn 16/10

63

ES2015

let someArray = [
               {name:"Kristian", lines:"2,5,10"},
               {name:"John", lines:"1,19,26,96"},
               {name:"Kristian", lines:"2,58,160"},
               {name:"Felix", lines:"1,19,26,96"}
            ];

someArray = someArray.filter(person => person.name != 'John');

Ele removerá John !


4
Cara ... Vindo de java, estou muito confuso de que algo tão básico a fazer requer filtragem de uma lista ... wtf. Esta é a resposta mais precisa à pergunta dos OPs que li até agora.
precisa saber é

Sim, esta é uma boa abordagem. Embora também funcione antes do ES2015 (ES6). A função de filtro está disponível desde a versão 5.1 (2011) ecma-international.org/ecma-262/5.1/#sec-15.4.4.20
user3777549

40

Você pode usar array.filter ().

por exemplo

        someArray = [{name:"Kristian", lines:"2,5,10"},
                     {name:"John", lines:"1,19,26,96"}];

        someArray = someArray.filter(function(returnableObjects){
               return returnableObjects.name !== 'Kristian';
        });

        //someArray will now be = [{name:"John", lines:"1,19,26,96"}];

Funções de seta:

someArray = someArray.filter(x => x.name !== 'Kristian')

Outra coisa que eu quero, haverá botões separados para cada objeto na matriz. se eu quiser excluir esse objeto em particular no botão da matriz clicou. como fazer isso . Eu usei js angular ng-repeat para gerar itens. você pode me ajudar
Thilak Raj

daCoda e se você tiver duas condições?
Malcolm Salvador

@MalcolmSalvador, por exemplo, se você tiver outras condições, pode escrever como abaixo e continuar com diferentes && ou || operador de acordo com sua necessidade. someArray = someArray.filter (function (returnableObjects) {return returnableObjects.name! == 'Kristian' && cond2Query.age> = 22;});
Biswajit Panday

18

Eu fiz uma função dinâmica pega os objetos Array, Key e value e retorna a mesma matriz depois de remover o objeto desejado:

function removeFunction (myObjects,prop,valu)
        {
             return myObjects.filter(function (val) {
              return val[prop] !== valu;
          });

        }

Exemplo completo: DEMO

var obj = {
            "results": [
              {
                  "id": "460",
                  "name": "Widget 1",
                  "loc": "Shed"
              }, {
                  "id": "461",
                  "name": "Widget 2",
                  "loc": "Kitchen"
              }, {
                  "id": "462",
                  "name": "Widget 3",
                  "loc": "bath"
              }
            ]
            };


        function removeFunction (myObjects,prop,valu)
        {
             return myObjects.filter(function (val) {
              return val[prop] !== valu;
          });

        }


console.log(removeFunction(obj.results,"id","460"));

15

Esta é uma função que funciona para mim:

function removeFromArray(array, value) {
    var idx = array.indexOf(value);
    if (idx !== -1) {
        array.splice(idx, 1);
    }
    return array;
}

Outra coisa que eu quero, haverá botões separados para cada objeto na matriz. se eu quiser excluir esse objeto em particular no botão da matriz clicou. como fazer isso . Eu usei js angular ng-repeat para gerar itens. você pode me ajudar
Thilak Raj

12

Você também pode tentar fazer algo assim:

var myArray = [{'name': 'test'}, {'name':'test2'}];
var myObject = {'name': 'test'};
myArray.splice(myArray.indexOf(myObject),1);

11
someArray = jQuery.grep(someArray , function (value) {
        return value.name != 'Kristian';
});

10

Use a função de emenda em matrizes. Especifique a posição do elemento inicial e o comprimento da subsequência que você deseja remover.

someArray.splice(pos, 1);

8

Vote no UndercoreJS para um trabalho simples com matrizes.

A função _.without () ajuda a remover um elemento:

 _.without([1, 2, 1, 0, 3, 1, 4], 0, 1);
    => [2, 3, 4]

A melhor solução. Funciona com matrizes de objetos.
Azee

4

Com a função de seta ES 6

let someArray = [
                 {name:"Kristian", lines:"2,5,10"},
                 {name:"John", lines:"1,19,26,96"}
                ];
let arrayToRemove={name:"Kristian", lines:"2,5,10"};
someArray=someArray.filter((e)=>e.name !=arrayToRemove.name && e.lines!= arrayToRemove.lines)

3

A solução mais simples seria criar um mapa que armazene os índices de cada objeto pelo nome, assim:

//adding to array
var newPerson = {name:"Kristian", lines:"2,5,10"}
someMap[ newPerson.name ] = someArray.length;
someArray.push( newPerson );

//deleting from the array
var index = someMap[ 'Kristian' ];
someArray.splice( index, 1 );

Eu gosto dessa idéia, mas também devo perguntar: quais são os limites de uso de memória para uma idéia como essa à medida que os índices são adicionados? Eu tenho uma matriz que eu gostaria de indexar em 2 campos diferentes no objeto, então eu teria 2 mapas além da matriz de origem original. É um preço pequeno a pagar pela velocidade de pesquisa ou existe uma solução que seria mais eficiente com a memória?
Brad G.

3

Embora isso provavelmente não seja apropriado para essa situação, descobri outro dia que você também pode usar a deletepalavra-chave para remover um item de uma matriz, se não precisar alterar o tamanho da matriz, por exemplo.

var myArray = [1,2,3];

delete myArray[1];

console.log(myArray[1]); //undefined

console.log(myArray.length); //3 - doesn't actually shrink the array down

3

Esta resposta

for (var i =0; i < someArray.length; i++)
   if (someArray[i].name === "Kristian") {
      someArray.splice(i,1);
   }

não está funcionando para vários registros que atendem à condição. Se você tiver dois desses registros consecutivos, apenas o primeiro será removido e o outro será ignorado. Você tem que usar:

for (var i = someArray.length - 1; i>= 0; i--)
   ...

em vez de .


2

Parece haver um erro na sintaxe da sua matriz, supondo que você queira dizer uma matriz em oposição a um objeto, Array.splice é seu amigo aqui:

someArray = [{name:"Kristian", lines:"2,5,10"}, {name:"John", lines:"1,19,26,96"}];
someArray.splice(1,1)

2

Você também pode usar a função de mapa .

someArray = [{name:"Kristian", lines:"2,5,10"},{name:"John",lines:"1,19,26,96"}];
newArray=[];
someArray.map(function(obj, index){
    if(obj.name !== "Kristian"){
       newArray.push(obj);
    }
});
someArray = newArray;
console.log(someArray);

1
Mas se você deseja percorrer a matriz, não é melhor usar o forEach?
Corse32

2

Você também pode usar some:

someArray = [{name:"Kristian", lines:"2,5,10"},
             {name:"John", lines:"1,19,26,96"}];

someArray.some(item => { 
    if(item.name === "Kristian") // Case sensitive, will only remove first instance
        someArray.splice(someArray.indexOf(item),1) 
})

2

É isso que eu uso.

Array.prototype.delete = function(pos){
    this[pos] = undefined;
    var len = this.length - 1;
    for(var a = pos;a < this.length - 1;a++){
      this[a] = this[a+1];
    }
    this.pop();
  }

Então é tão simples quanto dizer

var myArray = [1,2,3,4,5,6,7,8,9];
myArray.delete(3);

Substitua qualquer número no lugar de três. Após a saída esperada deve ser:

console.log(myArray); //Expected output 1,2,3,5,6,7,8,9

2

Se você deseja remover todas as ocorrências de um determinado objeto (com base em alguma condição), use o método de emenda de javascript dentro de a para o loop.

Como a remoção de um objeto afetaria o comprimento da matriz, diminua o contador em uma etapa, para que a verificação do comprimento permaneça intacta.

var objArr=[{Name:"Alex", Age:62},
  {Name:"Robert", Age:18},
  {Name:"Prince", Age:28},
  {Name:"Cesar", Age:38},
  {Name:"Sam", Age:42},
  {Name:"David", Age:52}
];

for(var i = 0;i < objArr.length; i ++)
{
  if(objArr[i].Age > 20)
  {
    objArr.splice(i, 1);
    i--;  //re-adjust the counter.
  }
}

O snippet de código acima remove todos os objetos com idade superior a 20.



1

splice (i, 1) onde i é o índice incremental da matriz removerá o objeto. Mas lembre-se de que a emenda também redefinirá o comprimento da matriz, portanto, atente para 'indefinido'. Usando seu exemplo, se você remover 'Kristian', na próxima execução dentro do loop, terei 2, mas someArray terá um comprimento de 1; portanto, se você tentar remover "John", receberá um erro "indefinido" . Uma solução para isso, embora não seja elegante, é ter um contador separado para acompanhar o índice do elemento a ser removido.


1

Retorna apenas objetos da matriz cuja propriedade namenão é "Kristian"

var noKristianArray = $.grep(someArray, function (el) { return el.name!= "Kristian"; });


Demo:

 var someArray = [
                {name:"Kristian", lines:"2,5,10"},
                {name:"John", lines:"1,19,26,96"},
                {name:"Kristian", lines:"2,58,160"},
                {name:"Felix", lines:"1,19,26,96"}
                ];
			 
var noKristianArray = $.grep(someArray, function (el) { return el.name!= "Kristian"; });

console.log(noKristianArray);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


0

Conceitos usando o Kendo Grid

var grid = $("#addNewAllergies").data("kendoGrid");

var selectedItem = SelectedCheckBoxList;

for (var i = 0; i < selectedItem.length; i++) {
    if(selectedItem[i].boolKendoValue==true)
    {
        selectedItem.length= 0;
    }
}

0

Eu acho que as respostas são muito ramificadas e atadas.

Você pode usar o caminho a seguir para remover um objeto de matriz que corresponda ao objeto fornecido no jargão moderno do JavaScript.


coordinates = [
    { lat: 36.779098444109145, lng: 34.57202827508546 },
    { lat: 36.778754712956506, lng: 34.56898128564454 },
    { lat: 36.777414146732426, lng: 34.57179224069215 }
];

coordinate = { lat: 36.779098444109145, lng: 34.57202827508546 };

removeCoordinate(coordinate: object) {
  const found = this.coordinates.find((obj) => obj === obj);
  if (found) {
    this.coordinates.splice(found, 1);
  }
}

this.removeCoordinate(coordinate);

-2

Se você deseja acessar e remover o objeto de uma matriz, basta tentar algo como isto.

// inside some function

let someArray = [ {"ColumnName" : "a", "PropertySerno" : 100005,"UpdateType" : 1},
                  {"ColumnName" : "b", "PropertySerno" : 100202,"UpdateType" : 1,
        "ShowRemoveButton" : true} ];
        
        for (let item of someArray) {
          delete item.ShowRemoveButton;
        }
        console.log(item.outputMappingData.Data);
        
//output will be like that = [ {"ColumnName" : "a", "PropertySerno" : 100005,"UpdateType" : 1},
//                             {"ColumnName" : "b", "PropertySerno" : 100202,"UpdateType" : 1 }];
        

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.