Poďme objasniť zmätok okolo metód slice (), splice () a split () v JavaScripte

Metódy zabudované v JavaScripte nám pri programovaní veľmi pomôžu, keď im správne porozumieme. Ja by som chcel vysvetliť, tri z nich v tomto článku: s slice(), splice()a split()metódy. Možno preto, že sú tak podobne pomenované, sú často zmätení, dokonca aj medzi skúsenými vývojármi.

Odporúčam študentom a junior vývojárom, aby si pozorne prečítali tento článok, pretože na tieto tri metódy sa môžete opýtať aj v ROZHOVOROCH PRÁCE.

Na konci nájdete zhrnutie každej metódy. Ak chcete, môžete si tiež pozrieť nižšie uvedenú verziu videa:

Takže začnime ...

Pole JavaScript

Najprv musíte pochopiť, ako fungujú polia JavaScriptu . Rovnako ako v iných programovacích jazykoch, aj na ukladanie viacerých údajov v JS používame polia. Rozdiel je však v tom, že polia JS môžu obsahovať naraz iný typ údajov.

Niekedy musíme na týchto poliach robiť operácie. Potom použijeme niektoré metódy JS, ako napríklad slice () & splice () . Nižšie vidíte, ako deklarovať pole v JavaScripte:

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

Teraz poďme deklarovať ďalšie pole s rôznymi dátovými typmi. Ďalej to použijem v príkladoch:

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

Toto použitie je platné v JavaScripte. Pole s rôznymi typmi údajov: reťazec, čísla a logická hodnota.

Plátok ()

Tieto plátok () metóda skopíruje daná časť poľa a vracia sa, že časť kopírovaný ako nového poľa. Nezmení to pôvodné pole.

array.slice(from, until);

  • Od: Plátok pole začína od indexu prvku
  • Kým: Plátok pole do iného indexu prvku

Napríklad chcem rozrezať prvé tri prvky z poľa vyššie. Pretože prvý prvok poľa je vždy indexovaný na 0, začnem krájať „od“ 0.

array.slice(0, until);

Teraz je tu zložitá časť. Keď chcem rozdeliť prvé tri prvky, musím dať parameter until ako 3. Metóda slice () nezahŕňa posledný daný prvok.

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

To môže spôsobiť určitý zmätok. Preto nazývam druhý parameter „do“.

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

Nakoniec priradím nakrájaný Array k premennej newArray . Teraz sa pozrime na výsledok:

Dôležitá poznámka: metódu Slice () je možné použiť aj na reťazce.

Spojka ()

Názov tejto funkcie je veľmi podobný slice () . Táto podobnosť pomenovaní často vývojárov mätie. Splice () metóda mení poľa, pridaním alebo odstránením prvky z nej. Pozrime sa, ako pridávať a odstraňovať prvky pomocou funkcie splice ( ) :

Odstraňovanie prvkov

Pri odstraňovaní prvkov musíme uviesť parameter indexu a počet prvkov, ktoré sa majú odstrániť:

array.splice(index, number of elements);

Index je východiskovým bodom na odstránenie prvkov. Prvky, ktoré majúz daného indexu menšie číslo indexu, nebudú odstránené:

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

Ak nedefinujeme druhý parameter, z poľa bude odstránený každý prvok začínajúci od daného indexu:

Ako druhý príklad uvádzam druhý parameter ako 1, takže prvky vychádzajúce z indexu 2 budú odstránené jeden po druhom zakaždým, keď zavoláme metódu splice () :

array.splice(2, 1);

Po 1. hovore:

Po 2. hovore:

Môže to pokračovať, kým už nebude existovať index 2.

Pridávanie prvkov

Pri pridávaní prvkov ich musíme dať ako 3., 4., 5. parameter (v závislosti od toho, koľko ich chcete pridať) do metódy splice () :

array.splice (index, počet prvkov, prvok, prvok);

Ako príklad pridávam a a b na samom začiatku poľa a nič neodstraňujem:

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

Split ()

Metódy slice () a splice () sú pre polia. Pre reťazce sa používa metóda split () . Rozdelí reťazec na podreťazce a vráti ich ako pole. Trvá to 2 parametre a oba sú voliteľné.

string.split(separator, limit);

  • Separator: Definuje, ako rozdeliť reťazec ... čiarkou, znakom atď.
  • Limit: Obmedzuje počet rozdelení na daný počet

Metóda split () nefunguje priamo pre polia . Najprv však môžeme previesť prvky nášho poľa na reťazec, potom môžeme použiť metódu split () .

Pozrime sa, ako to funguje.

Najskôr konvertujeme naše pole na reťazec metódou toString () :

let myString = array.toString();

Teraz sa poďme rozdelenú MyString podľa čiarkami, obmedziť iba na troch čiastkových, a vrátiť ich ako pole:

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

Ako vidíme, reťazec myString je rozdelený čiarkami. Pretože sme obmedzili rozdelenie na 3, vrátia sa iba prvé 3 prvky.

POZNÁMKA: Ak máme takéto použitie:array.split("");potom bude každý znak reťazca rozdelený ako podreťazce:

Zhrnutie:

Plátok ()

  • Kopíruje prvky z poľa
  • Vráti ich ako nové pole
  • Nezmení pôvodné pole
  • Začína sa krájať od ... do daného indexu: array.slice (od, do)
  • Plátok neobsahuje parameter indexu „do“
  • Môže byť použitý ako pole, tak aj pre reťazce

Spojka ()

  • Používa sa na pridávanie / odoberanie prvkov z poľa
  • Vráti pole odstránených prvkov
  • Zmení pole
  • Na pridanie prvkov: array.splice (index, počet prvkov, prvok)
  • Na odstránenie prvkov: array.splice (index, počet prvkov)
  • Možno použiť iba pre polia

Split ()

  • Rozdelí reťazec na podreťazce
  • Vráti ich do poľa
  • Berie 2 parametre, oba sú voliteľné: string.split (separator, limit)
  • Nezmení pôvodný reťazec
  • Možno použiť iba na struny

Existuje mnoho ďalších zabudovaných metód pre polia a reťazce JavaScriptu, ktoré uľahčujú prácu s programovaním v JavaScripte. Ďalej si môžete pozrieť môj nový článok o metódach podreťazcov v jazyku JavaScript.

Ak sa chcete dozvedieť viac o vývoji webu, neváhajte ma sledovať na Youtube !

Ďakujem za čítanie!