Objekt aus Array entfernen mit JavaScript

Question

Wie kann ich ein Objekt aus einem Array entfernen? Ich möchte das Objekt entfernen, das den Namen Kristian von someArray . Zum Beispiel:

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

Ich möchte etwas erreichen:

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

Answer 1

Sie könnten auch so vorgehen:

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

Answer 2

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

Answer 3

Verwenden Sie die Splice-Funktion für Arrays. Geben Sie die Position des Startelements und die Länge der Teilsequenz an, die Sie entfernen möchten.

someArray.splice(pos, 1);

Answer 4

Leistung

Heute 2021.01.27 führe ich Tests auf MacOs HighSierra 10.13.6 mit Chrome v88, Safari v13.1.2 und Firefox v84 für ausgewählte Lösungen durch.

Ergebnisse

Für alle Browser:

• schnelle/schnellste Lösungen, wenn kein Element vorhanden ist: A und B
• schnelle/schnellste Lösungen für große Arrays: C
• schnelle/schnellste Lösungen für große Arrays, wenn ein Element vorhanden ist: H
• recht langsame Lösungen für kleine Arrays: F und G
• recht langsame Lösungen für große Arrays: D, E und F

Einzelheiten

Ich führe 4 Testfälle durch:

• kleines Array (10 Elemente) und Element vorhanden - Sie können es ausführen HIER
• kleines Array (10 Elemente) und Element NICHT vorhanden - Sie können es ausführen HIER
• großes Array (Millionen Elemente) und Element vorhanden - Sie können es ausführen HIER
• großes Array (Millionen von Elementen) und Element NICHT vorhanden - Sie können es ausführen HIER

Der folgende Ausschnitt zeigt die Unterschiede zwischen den Lösungen A B C D E F G H I

function A(arr, name) {
  let idx = arr.findIndex(o => o.name==name);
  if(idx>=0) arr.splice(idx, 1);
  return arr;
}

function B(arr, name) {
  let idx = arr.findIndex(o => o.name==name);
  return idx<0 ? arr : arr.slice(0,idx).concat(arr.slice(idx+1,arr.length));
}

function C(arr, name) {
  let idx = arr.findIndex(o => o.name==name);
  delete arr[idx];
  return arr;
}

function D(arr, name) {
  return arr.filter(el => el.name != name);
}

function E(arr, name) {
  let result = [];
  arr.forEach(o => o.name==name || result.push(o));
  return result;
}

function F(arr, name) {
  return _.reject(arr, el => el.name == name);
}

function G(arr, name) {
  let o = arr.find(o => o.name==name);
  return _.without(arr,o);
}

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

function I(arr, name) {
  return $.grep(arr,o => o.name!=name);
}

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

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

let test3 = [   
    {name:"John3", lines:"1,19,26,96"},
    {name:"John", lines:"1,19,26,96"},
  {name:"Joh2", lines:"1,19,26,96"},
];

console.log(`
Test1: original array from question
Test2: array with more data
Test3: array without element which we want to delete
`);

[A,B,C,D,E,F,G,H,I].forEach(f=> console.log(`
Test1 ${f.name}: ${JSON.stringify(f([...test1],"Kristian"))}
Test2 ${f.name}: ${JSON.stringify(f([...test2],"Kristian"))}
Test3 ${f.name}: ${JSON.stringify(f([...test3],"Kristian"))}
`));

<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.20/lodash.min.js" integrity="sha512-90vH1Z83AJY9DmlWa8WkjkV79yfS2n2Oxhsi2dZbIv0nC4E6m5AbH8Nh156kkM7JePmqD6tcZsfad1ueoaovww==" crossorigin="anonymous"> </script>

This shippet only presents functions used in performance tests - it not perform tests itself!

Und hier sind Beispielergebnisse für Chrom

Answer 5

Hier ist ein Beispiel mit Map und Splice

const arrayObject = [
  { name: "name1", value: "value1" },
  { name: "name2", value: "value2" },
  { name: "name3", value: "value3" },
];

let index = arrayObject.map((item) => item.name).indexOf("name1");
if (index > -1) {
  arrayObject.splice(index, 1);
  console.log("Result", arrayObject);
}

Ausgabe

Result [
  {
    "name": "name2",
    "value": "value2"
  },
  {
    "name": "name3",
    "value": "value3"
  }
]