Odpravimo zmedo okoli metod slice (), splice () in split () v JavaScript

Vgrajene metode JavaScript nam zelo pomagajo pri programiranju, ko jih pravilno razumemo. Želel bi pojasniti, tri od njih v tem članku: o slice(), splice()in split()metode. Morda zato, ker je njihovo poimenovanje tako podobno, so pogosto zmedeni tudi med izkušenimi razvijalci.

Študentom in mlajšim razvijalcem svetujem, naj ta članek natančno preberejo, saj je te tri metode mogoče vprašati tudi v POSLOVNIH INTERVJUJIH.

Na koncu najdete povzetek vsake metode. Če želite, si lahko ogledate tudi spodnjo video različico:

Začnimo ...

Nizov JavaScript

Najprej morate razumeti, kako delujejo nizi JavaScript . Tako kot v drugih programskih jezikih tudi v JS uporabljamo nize za shranjevanje več podatkov. Toda razlika je v tem, da lahko polja JS hkrati vsebujejo različne vrste podatkov.

Včasih moramo narediti operacije na teh nizih. Nato uporabimo nekatere metode JS, kot so slice () in splice () . Spodaj lahko vidite, kako prijavite polje v JavaScript:

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

Zdaj pa razglasimo še eno matriko z različnimi tipi podatkov. Spodaj ga bom uporabil v primerih:

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

Ta uporaba velja v JavaScript. Matrika z različnimi vrstami podatkov: niz, številke in logična vrednost.

Rezina ()

V rezina () metoda kopije določen del matrike in donose, ki kopirajo dela kot nov niz. Ne spremeni prvotnega polja.

array.slice(from, until);

  • Od: Razreži matriko, začenši z indeksom elementa
  • Do: Razrežite matriko do indeksa drugega elementa

Na primer, želim izrezati prve tri elemente iz zgornjega polja. Ker je prvi element matrike vedno indeksiran na 0, začnem rezanje "od" 0.

array.slice(0, until);

Zdaj je tu zapleten del. Ko želim rezina prve tri elemente, moram dati , dokler parameter kot 3. metoda rezina () ne vključuje zadnji določen element.

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

To lahko ustvari nekaj zmede. Zato drugi parameter imenujem "dokler".

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

Končno dodelim narezan Array spremenljivki newArray . Zdaj pa poglejmo rezultat:

Pomembno: metodo Slice () lahko uporabite tudi za nize.

Spoj ()

Ime te funkcije je zelo podobno slice () . Ta podobnost poimenovanja razvijalce pogosto zmede. Spoj () Metoda spremeni matriko z dodajanjem ali odstranitvijo elementov iz nje. Poglejmo, kako dodati in odstraniti elemente s splice ( ) :

Odstranjevanje elementov

Za odstranjevanje elementov moramo navesti parameter indeksa in število elementov, ki jih je treba odstraniti:

array.splice(index, number of elements);

Kazalo je izhodišče za odstranjevanje elementov. Elementi, ki imajo manjše indeksno število od danega indeksa, ne bodo odstranjeni:

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

Če drugega parametra ne določimo, bo iz polja odstranjen vsak element, ki se začne z danim indeksom:

Kot drugi primer dajem drugi parameter kot 1, zato bodo elementi, ki se začnejo z indeksom 2, odstranjeni eden za drugim vsakič, ko pokličemo metodo splice () :

array.splice(2, 1);

Po prvem klicu:

Po 2. klicu:

To se lahko nadaljuje, dokler ni več indeksa 2.

Dodajanje elementov

Za dodajanje elementov jih moramo dati kot 3., 4., 5. parameter (odvisno od tega, koliko jih dodamo ) metodi splice () :

array.splice (indeks, število elementov, element, element);

Kot primer dodam a in b na samem začetku polja in nič ne odstranim:

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

Razdeli ()

Metodi Slice () in splice () sta za nize. Za nize se uporablja metoda split () . Niz razdeli na podnize in jih vrne kot matriko. Potrebna sta 2 parametra, oba pa sta neobvezna.

string.split(separator, limit);

  • Ločilo: Določa, kako razdeliti niz ... z vejico, znakom itd.
  • Omejitev: omeji število delitev z dano številko

Metoda split () ne deluje neposredno za polja . Vendar lahko elemente našega polja najprej pretvorimo v niz, nato lahko uporabimo metodo split () .

Poglejmo, kako deluje.

Najprej pretvorimo svoje polje v niz z metodo toString () :

let myString = array.toString();

Zdaj pa ločimo myString z vejicami, jih omejimo na tri podnize in jih vrnemo kot matriko:

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

Kot lahko vidimo, je myString razdeljen z vejicami. Ker omejitev delimo na 3, se vrnejo samo prvi 3 elementi.

OPOMBA: Če imamo takšno uporabo:array.split("");potem bo vsak znak niza razdeljen kot podniz:

Povzetek:

Rezina ()

  • Kopira elemente iz polja
  • Vrne jih kot novo matriko
  • Ne spremeni prvotnega polja
  • Začne rezanje od ... do danega indeksa: array.slice (od, do)
  • Rezina ne vključuje parametra indeksa "dokler"
  • Uporablja se lahko za polja in nize

Spoj ()

  • Uporablja se za dodajanje / odstranjevanje elementov iz polja
  • Vrne polje odstranjenih elementov
  • Spremeni matriko
  • Za dodajanje elementov: array.splice (indeks, število elementov, element)
  • Za odstranjevanje elementov: array.splice (indeks, število elementov)
  • Lahko se uporablja samo za nize

Razdeli ()

  • Razdeli niz na podnize
  • Vrne jih v matriki
  • Vzame 2 parametra, oba sta neobvezna: string.split (ločilo, omejitev)
  • Ne spremeni prvotnega niza
  • Lahko se uporablja samo za nize

Obstajajo številne druge vgrajene metode za polja in nize JavaScript, ki olajšajo delo s programiranjem JavaScript. Nato si lahko ogledate moj novi članek o metodah podnizov JavaScript.

Če želite izvedeti več o spletnem razvoju, me spremljajte na Youtubeu !

Hvala za branje!