Lahendame segaduse viilu (), splice () ja split () ümber JavaScripti

JavaScripti sisseehitatud meetodid aitavad meid programmeerimisel palju, kui oleme neist õigesti aru saanud. Ma tahaksin selgitada kolme neist seda artiklit: slice(), splice()ja split()meetodeid. Võib-olla seetõttu, et nende nimetamine on nii sarnane, on nad sageli segaduses isegi kogenud arendajate seas.

Soovitan õpilastel ja noorematel arendajatel see artikkel hoolikalt läbi lugeda, sest neid kolme meetodit võib küsida ka TÖÖKÜSITLUSTES.

Lõpuks leiate iga meetodi kokkuvõtte. Soovi korral saate vaadata ka allpool olevat videoversiooni:

Alustame siis ...

JavaScripti massiivid

Esiteks peate mõistma, kuidas JavaScripti massiivid töötavad. Nagu teisteski programmeerimiskeeltes, kasutame JS-is mitmete andmete salvestamiseks massiive. Kuid erinevus seisneb selles, et JS- massiivid võivad korraga sisaldada erinevat tüüpi andmeid.

Mõnikord peame nende massiividega toiminguid tegema. Seejärel kasutame mõnda JS-i meetodit, näiteks slice () & splice () . Allpool näete, kuidas massiivi deklareerida JavaScripti abil:

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

Nüüd kuulutame välja teise massiivi, millel on erinevad andmetüübid. Kasutan seda allpool näidetes:

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

See kasutus on JavaScripti puhul kehtiv . Erinevate andmetüüpidega massiiv: string, arvud ja tõeväärtus.

Viil ()

Viilu () meetodi koopiad antud osa massiivi ja tootlus kopeeritud osa uue massiivi. See ei muuda algset massiivi.

array.slice(from, until);

  • Alates: Slice massiivi alustades alates element indeks
  • Kuni: viilutage massiiv kuni teise elemendi indeksini

Näiteks tahan viilutada ülaltoodud massiivist kolm esimest elementi. Kuna massiivi esimene element on alati indekseeritud 0-ga, hakkan viilutama “alates” 0-st.

array.slice(0, until);

Nüüd on siin keeruline osa. Kui ma tahan lõigata esimesed kolm elementi, pean ma parameetriks kuni andma väärtuseks 3. Meetod slice () ei sisalda viimast antud elementi.

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

See võib tekitada teatud segadust. Sellepärast nimetan teist parameetrit “kuni”.

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

Lõpuks määran viilutatud massiivi muutujale newArray . Nüüd vaatame tulemust:

Oluline märkus: Slice () meetodit saab kasutada ka stringide jaoks.

Ühenduskoht ()

Selle funktsiooni nimi on väga sarnane slice () -ga . See nimetamise sarnasus ajab arendajaid sageli segadusse. Splaissingu () meetodi muudab massiivi, lisades või eemaldades elemente ta. Vaatame, kuidas lisada ja eemaldada elemente ühendusega ( ) :

Elementide eemaldamine

Elementide eemaldamiseks peame andma indeksi parameetri ja eemaldatavate elementide arvu :

array.splice(index, number of elements);

Indeks onelementide eemaldamise lähtepunkt . Elemente, millel onantud indeksist väiksem indeksinumber, ei eemaldata:

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

Kui me ei määra teist parameetrit, eemaldatakse massiivist kõik antud indeksist algavad elemendid:

Teise näitena annan teise parameetri väärtuseks 1, nii et indeksist 2 algavad elemendid eemaldatakse ükshaaval iga kord, kui nimetame meetodit splice () :

array.splice(2, 1);

Pärast esimest kõnet:

Pärast teist kõnet:

Seda saab jätkata, kuni enam pole indeksit 2.

Elementide lisamine

Elementide lisamiseks peame andma need meetodiks splice () 3., 4., 5. parameetrina (sõltub lisatavate arvust ) :

array.splice (indeks, elementide arv, element, element);

Näiteks lisan massiivi algusesse a ja b ja ma ei eemalda midagi:

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

Poolita ()

Slice () ja splice () meetodid on mõeldud massiivide jaoks. Split () meetodit kasutatakse stringe . See jagab stringi alamstringideks ja tagastab need massiivina. See võtab 2 parameetrit ja mõlemad on valikulised.

string.split(separator, limit);

  • Eraldaja: määrab, kuidas stringi jagada koma, märgi vms abil.
  • Limit: piirab jagatud arvu antud arvuga

Split () meetod ei tööta otse massiivid . Kuid kõigepealt võime oma massiivi elemendid teisendada stringiks, seejärel saame kasutada split () meetodit.

Vaatame, kuidas see töötab.

Esiteks teisendame oma massiivi stringiks toString () meetodiga:

let myString = array.toString();

Nüüd split myString poolt komadega piirata nende kolme alamstringide ja tagastab need massiivi:

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

Nagu näeme, on myString jaotatud komadega. Kuna jagamise piirame 3-ga, tagastatakse ainult kolm esimest elementi.

MÄRKUS. Kui meil on selline kasutus:array.split("");siis jagatakse stringi iga märk alamstringidena:

Kokkuvõte:

Viil ()

  • Kopeerib massiivi elemendid
  • Tagastab need uue massiivina
  • Ei muuda algset massiivi
  • Alustab viilutamist alates… kuni antud indeksini: array.slice (alates, kuni)
  • Lõik ei sisalda indeksi parameetrit „kuni”
  • Saab kasutada nii massiivide kui ka stringide jaoks

Ühenduskoht ()

  • Kasutatakse massiivi elementide lisamiseks / eemaldamiseks
  • Tagastab eemaldatud elementide massiivi
  • Muudab massiivi
  • Elementide lisamiseks: array.splice (register, elementide arv, element)
  • Elementide eemaldamiseks: array.splice (register, elementide arv)
  • Saab kasutada ainult massiivide jaoks

Poolita ()

  • Jagab stringi alamstringideks
  • Tagastab need massiivina
  • Võtab 2 parameetrit, mõlemad on valikulised: string.split (eraldaja, piir)
  • Ei muuda algset stringi
  • Saab kasutada ainult stringide jaoks

JavaScripti massiivide ja stringide jaoks on palju muid sisseehitatud meetodeid, mis hõlbustavad JavaScripti programmeerimisega töötamist. Järgmisena saate vaadata minu uut artiklit JavaScripti alamstringimeetodite kohta.

Kui soovite veebiarenduse kohta rohkem teada saada, jälgige mind julgelt Youtube'is !

Aitäh, et lugesid!