La oss rydde opp i forvirringen rundt slice (), splice () og split () -metodene i JavaScript

JavaScript innebygde metoder hjelper oss mye når vi programmerer, når vi først forstår dem riktig. Jeg ønsker å forklare tre av dem i denne artikkelen: de slice(), splice()og split()metoder. Kanskje fordi navnene deres er så like, er de ofte forvirret, selv blant erfarne utviklere.

Jeg anbefaler studenter og juniorutviklere å lese denne artikkelen nøye fordi disse tre metodene også kan bli spurt i JOBBINVJUER.

Du kan finne et sammendrag av hver metode til slutt. Hvis du foretrekker det, kan du også se videoversjonen nedenfor:

Så la oss starte ...

JavaScript-matriser

For det første må du forstå hvordan JavaScript-arrays fungerer. Som i andre programmeringsspråk bruker vi matriser for å lagre flere data i JS. Men forskjellen er at JS- matriser kan inneholde forskjellige typer data samtidig.

Noen ganger må vi utføre operasjoner på disse matriser. Deretter bruker vi noen JS-metoder som slice () & splice () . Du kan se nedenfor hvordan du erklærer en matrise i JavaScript:

let arrayDefinition = []; // Array declaration in JS

La oss nå erklære en annen matrise med forskjellige datatyper. Jeg vil bruke det nedenfor i eksempler:

let array = [1, 2, 3, "hello world", 4.12, true];

Denne bruken er gyldig i JavaScript. En matrise med forskjellige datatyper: streng, tall og boolsk.

Skive ( )

De skive () metoden kopierer en gitt del av en matrise og returnerer det kopierte del som en ny matrise. Det endrer ikke den opprinnelige matrisen.

array.slice(from, until);

Fra: Del opp matrisen fra en elementindeks
Fram til: Skjær matrisen til en annen elementindeks

For eksempel vil jeg kutte de tre første elementene fra matrisen ovenfor. Siden det første elementet i en matrise alltid er indeksert til 0, begynner jeg å kutte "fra" 0.

array.slice(0, until);

Nå er det den vanskelige delen. Når jeg ønsker å skjære de første tre elementene, får jeg gi inntil parameteren som 3. Den skive () metoden ikke omfatter det siste gitte elementet.

array[0] --> 1 // included array[1] --> 2 // included array[2] --> 3 // included array[3] --> "hello world" // not included

Dette kan skape forvirring. Derfor kaller jeg den andre parameteren “til”.

let newArray = array.slice(0, 3); // Return value is also an array

Til slutt tilordner jeg den oppskårne matrisen til den nye Array- variabelen. La oss nå se resultatet:

Viktig merknad: Slice () -metoden kan også brukes til strenger.

Skjøte ()

Navnet på denne funksjonen ligner veldig på slice () . Denne navngivningslikheten forvirrer ofte utviklere. Den skjøten () metode forandrer en matrise, ved å legge til eller fjerne elementer fra det. La oss se hvordan du legger til og fjerner elementer med spleis ( ) :

Fjerne elementer

For fjerning av elementer, trenger vi å gi indeks -parameteren, og det antall elementer som skal fjernes:

array.splice(index, number of elements);

Indeks er utgangspunktet for å fjerne elementer. Elementer som har et mindre indeksnummer fra den gitte indeksen vil ikke bli fjernet:

array.splice(2); // Every element starting from index 2, will be removed

Hvis vi ikke definerer den andre parameteren, vil hvert element som starter fra den gitte indeksen bli fjernet fra matrisen:

Som et andre eksempel gir jeg den andre parameteren som 1, slik at elementer som starter fra indeks 2 vil bli fjernet en etter en hver gang vi kaller metoden splice () :

array.splice(2, 1);

Etter første samtale:

Etter 2. samtale:

Dette kan fortsette til det ikke er noen indeks 2 lenger.

Legge til elementer

For å legge til elementer, må vi gi dem som den tredje, fjerde, femte parameteren (avhenger av hvor mange du skal legge til) til spleisemetoden () :

array.splice (indeks, antall elementer, element, element);

Som et eksempel legger jeg til a og b helt i begynnelsen av matrisen, og jeg fjerner ingenting:

array.splice(0, 0, 'a', 'b');

Split ()

Slice () og splice () -metoder er for matriser. Den split () metoden benyttes for strenger . Den deler en streng i understrenger og returnerer dem som en matrise. Det tar to parametere, og begge er valgfrie.

string.split(separator, limit);

Separator: Definerer hvordan du skal dele en streng ... med komma, tegn osv.
Limit: Begrens antall splittelser med et gitt tall

Den split () metoden fungerer ikke direkte for matriser . Imidlertid kan vi først konvertere elementene i matrisen til en streng, så kan vi bruke split () -metoden.

La oss se hvordan det fungerer.

For det første konverterer vi matrisen til en streng med toString () -metoden:

let myString = array.toString();

La oss nå dele myString med komma, begrense dem til tre strenger, og returnere dem som en matrise:

let newArray = myString.split(",", 3);

Som vi kan se, er myString delt med kommaer. Siden vi begrenser splitt til 3, returneres bare de tre første elementene.

MERKNAD: Hvis vi har en slik bruk:array.split("");Da vil hvert tegn i strengen bli delt som understreng: