Du kan ta bort ett matriselement på flera olika sätt, så se till att du väljer det som är mest lämpligt för dina omständigheter.
Arrayer är en av de vanliga datastrukturerna du kommer att interagera med i JavaScript. När du tar bort ett föremål från en array finns det olika metoder till ditt förfogande. Allt beror på var elementet du vill ta bort är och hur du vill identifiera det.
Se vilka olika sätt att ta bort ett JavaScript-matriselement, oavsett om det är i början, slutet eller någonstans däremellan.
1. Ta bort det första elementet från en array
För att ta bort det första elementet i en array, använd JavaScripts inbyggda flytta() metod. Det fungerar direkt genom att ta bort föremålet och sedan flytta indexen för alla återstående föremål.
Efter att ha tagit bort objektet returnerar skiftmetoden det. Det betyder att du kan tilldela det borttagna elementet till en annan variabel och använda den senare om du vill.
Här är hur:
konst demoArray = [1, 2, 3, 4, 5];
konst firstElement = demoArray.shift();
trösta.log (demoArray); // loggar [2, 3, 4, 5]
trösta.log (firstElement); // loggar 1
2. Ta bort det sista elementet från en array
JavaScript har en inbyggd pop() metod för att ta bort det sista objektet i en array. Som flytta() metod, pop() returnerar det borttagna objektet från arrayen.
konst demoArray = [1, 2, 3, 4, 5];
konst lastElement = demoArray.pop();
trösta.log (demoArray); // loggar [1, 2, 3, 4]
trösta.log (lastElement); // loggar 5
Shift och pop är två av de vanligaste JavaScript-array-metoder, men de kan bara få dig så långt. Bortsett från dessa två finns det flera metoder som ger dig mer precision över de element du tar bort.
3. Använda Delete Operator
Alternativt kan du använda JavaScript radera operator för att ta bort ett givet matriselement vid ett specifikt index. Men till skillnad från andra metoder som vi har tittat på tidigare, finns det en hake.
De radera operatorn tar bara bort värdet och lämnar en array med en tom lucka vid dess index. Längden på den ursprungliga arrayen förblir dock densamma, även om du tar bort det sista elementet.
konst demoArray = [1, 2, 3, 4, 5];
radera demoArray[2];
trösta.log (demoArray[2]); // loggar odefinierade
trösta.log (demoArray.length); // loggar 5
trösta.log (demoArray); // loggar [1, 2, tom, 4, 5]
4. Ta bort ett matriselement efter värde
Du kan också ta bort ett specifikt matrisobjekt efter värde. Det finns ingen inbyggd metod för att göra detta, men du kan kombinera två befintliga metoder för att göra detta: index för() och splitsa().
Dessa två gör att du kan ta bort ett specifikt element från en array utan att ha ett index. Börja först med att hitta indexet för elementet av intresse med hjälp av index för():
konst demoArray = [1, 2, 3, 4, 5];
konst targetElementIndex = demoArray.indexOf(4);
trösta.log (targetElementIndex); // loggar 3
Metoden indexOf returnerar indexet för den första förekomsten av värdet du anger, även om värdet finns mer än en gång. Om den inte hittar något matchande element alls, returnerar indexOf -1.
Nu när du har indexet för målelementet kan du använda splitsa() metod för att ta bort objektet i det indexet. Allt du behöver göra är att skicka in indexet för målelementet som första argument, följt av antalet objekt du vill ta bort.
För att bara ta bort ett enstaka föremål, skicka ett värde på 1 som det andra argumentet:
demoArray.splice (targetElementIndex, 1);
De splitsa() metod returnerar en array av de borttagna elementen och kommer att modifiera den ursprungliga arrayen av element, precis som flytta() och pop().
Om några av dessa metoder är nya för dig, kolla in vår fullständigt JavaScript-fuskblad. Den innehåller alla array-metoder som är tillgängliga för dig, inte bara för att ta bort, utan för andra operationer som att lägga till, loopa, vända och filtrera objekt.
Arbeta med JavaScript-matriser som ett proffs
Att veta hur man arbetar med arrayer i JavaScript är viktigt för alla webbutvecklare på grund av hur ofta du stöter på dem.
Nyckelkoncepten att bemästra är alla de inbyggda metoder som står till ditt förfogande som kan hjälpa dig att göra nästan vad som helst när du arbetar med arrayer.
