U kunt een array-element op verschillende manieren verwijderen, dus zorg ervoor dat u de meest geschikte kiest voor uw omstandigheden.

Arrays zijn een van de algemene gegevensstructuren waarmee u in JavaScript zult werken. Bij het verwijderen van een item uit een array staan ​​er verschillende methoden tot uw beschikking. Het hangt allemaal af van waar het element dat u wilt verwijderen zich bevindt en hoe u het wilt identificeren.

Bekijk wat de verschillende manieren zijn om een ​​JavaScript-array-element te verwijderen, of het nu aan het begin, het einde of ergens tussenin staat.

1. Verwijder het eerste element uit een array

Gebruik het ingebouwde JavaScript om het eerste element in een array te verwijderen verschuiving() methode. Het werkt direct door het item te verwijderen en vervolgens de indexen van alle resterende items te verschuiven.

Nadat het item is verwijderd, retourneert de shift-methode het. Dat betekent dat u het verwijderde element aan een andere variabele kunt toewijzen en later kunt gebruiken als u dat wilt.

instagram viewer

Hier is hoe:

const demoArray = [1, 2, 3, 4, 5];
const eersteElement = demoArray.shift();
troosten.log (demoArray); // logboeken [2, 3, 4, 5]
troosten.log (eersteElement); // logboeken 1

2. Verwijder het laatste element uit een array

JavaScript heeft een ingebouwd knal() methode voor het verwijderen van het laatste item in een array. Zoals de verschuiving() methode, knal() retourneert het verwijderde item uit de array.

const demoArray = [1, 2, 3, 4, 5];
const laatsteElement = demoArray.pop();
troosten.log (demoArray); // logboeken [1, 2, 3, 4]
troosten.log (laatsteElement); // logboeken 5

Shift en pop zijn twee van de meest voorkomende JavaScript-arraymethoden, maar ze kunnen je alleen zo ver krijgen. Afgezien van deze twee zijn er verschillende methoden die u meer precisie geven over de elementen die u verwijdert.

3. De delete-operator gebruiken

Als alternatief kunt u JavaScript gebruiken verwijderen operator om een ​​bepaald array-element bij een specifieke index te verwijderen. In tegenstelling tot andere methoden die we eerder hebben bekeken, zit er echter een addertje onder het gras.

De verwijderen operator verwijdert alleen de waarde en laat een array achter met een leeg gat in de index. De lengte van de oorspronkelijke array blijft echter hetzelfde, zelfs als u het laatste element verwijdert. 

const demoArray = [1, 2, 3, 4, 5];
verwijderen demoArray[2];
troosten.log (demoArray[2]); // logboeken ongedefinieerd
troosten.log (demoArray.lengte); // logboeken 5
troosten.log (demoArray); // logboeken [1, 2, leeg, 4, 5]

4. Verwijder een matrixelement op waarde

U kunt ook een specifiek array-item op waarde verwijderen. Er is geen ingebouwde methode om dit te doen, maar u kunt twee bestaande methoden combineren om dit te doen: index van() En splitsen().

Met deze twee kunt u een specifiek element uit een array verwijderen zonder een index te hebben. Begin eerst met het vinden van de index van het element van interesse met behulp van index van():

const demoArray = [1, 2, 3, 4, 5];
const targetElementIndex = demoArray.indexOf(4);
troosten.log (targetElementIndex); // logboeken 3

De methode indexOf retourneert de index van de eerste keer dat de opgegeven waarde voorkomt, zelfs als de waarde meer dan eens voorkomt. Als het helemaal geen overeenkomend element vindt, keert indexOf terug -1.

Nu je de index van het doelelement hebt, kun je de splitsen() methode om het item bij die index te verwijderen. Het enige dat u hoeft te doen, is de index van het doelelement als eerste argument doorgeven, gevolgd door het aantal items dat u wilt verwijderen.

Als u slechts één item wilt verwijderen, geeft u een waarde van op 1 als tweede argument:

demoArray.splice (targetElementIndex, 1);

De splitsen() methode retourneert een array van de verwijderde elementen en zal de oorspronkelijke array van elementen wijzigen, net als verschuiving() En knal().

Als sommige van deze methoden nieuw voor je zijn, bekijk dan onze volledige JavaScript-cheatsheet. Het bevat alle array-methoden die voor u beschikbaar zijn, niet alleen voor het verwijderen, maar ook voor andere bewerkingen zoals het toevoegen, herhalen, omkeren en filteren van items.

Werk met JavaScript-arrays als een professional

Weten hoe u met arrays in JavaScript moet werken, is essentieel voor alle webontwikkelaars vanwege de frequentie waarmee u ze tegenkomt.

De belangrijkste concepten die u onder de knie moet krijgen, zijn alle ingebouwde methoden die tot uw beschikking staan ​​en waarmee u bijna alles kunt doen wanneer u met arrays werkt.