Istražimo sintaksu Slice (), Splice () & Spread (...) u JavaScript-u

Naišao sam na ovaj izazov za freeCodeCamp i neko vrijeme zapeo razmišljajući o tome kako bih mogao pronaći način da ga riješim. Već su spomenuli rješavanje pomoću Slice & Splice. Tada sam bio zbunjen kada koristiti Slice, a kada Splice.

Evo, podijelit ću kako sam to riješio tim metodama.

I Slice i Splice koriste se za manipulaciju nizovima. Da vidimo kako to rade.

Kriška:

Metoda Slice uzima 2 argumenta.

1. argument : Određuje odakle odabir treba započeti.

Na primjer:

var arr1 = [1,5,8,9]; arr1.slice(1); // [5,8,9]

Iz prvog indeksa (5) vratit će elemente.

2. argument : Određuje na kojoj razini treba biti krajnja točka. Ako ovo niste stavili u zagradu dok ste pozivali metodu slice, vratit će elemente s početnog indeksa na kraj niza.

var arr1 = [1,5,8,9]; console.log(arr1.slice(1,3)); //[ 5, 8 ]

Ako tijekom pozivanja stavite negativan broj, odabir će se odabrati s kraja niza.

var arr1 = [1,5,8,9]; console.log(arr1.slice(-2)); //[ 8, 9 ]

Napomena: Slice uvijek vraća odabrane elemente iz niza.

Slice neće promijeniti niz. Niz ostaje netaknut. Pogledajte donji primjer:

var arr1 = [1,5,8,9]; arr1.slice(2); console.log(arr1); // [ 1, 5, 8, 9 ]

Čak i ako ste unijeli neke promjene u polje, to neće utjecati na njega. Vratit će izvorni niz kakav je na početku.

Spoj:

Može potrajati više argumenata.

To znaci,

1. argument : Određuje na kojem položaju novi ili postojeći element treba dodati / ukloniti. Ako je vrijednost negativna, pozicija će se računati od kraja niza.

2. argument : Brojevi elemenata koje treba ukloniti s početnog položaja. Ako je 0, tada se neće ukloniti elementi. Ako se ne preda, izbrisat će sve elemente s početnog položaja.

var arr1 = [1,5,8,9]; console.log(arr1.splice(1,2)); // [ 5, 8 ]

3. argument -> n. Argument : Vrijednost predmeta koje želite dodati u niz.

var arr1 = [1,5,8,9]; console.log(arr1.splice(1,2,'Hi','Medium')); // [5,8]

Možda mislite da smo u niz dodali "Bok", "Srednje", ali ovdje se ne prikazuje .... Pravo?

Da, utješili smo arr1.splice (1,2, 'Bok', 'Srednje').

Bilješka:

  • Spoj će vratiti uklonjene elemente samo iz niza.
  • Spoj će promijeniti izvorni niz
var arr1 = [1,5,8,9]; arr1.splice(1,2,'Hi','Medium'); console.log(arr1); // [ 1, 'Hi', 'Medium', 9 ]

Sintaksa širenja:

Definicija : Omogućava proširivanje itera, poput izraza niza ili niza, na mjestima gdje se očekuje nula ili više argumenata (za pozive funkcija) ili elemenata (za literal niza) ili proširivanje izraza objekta na mjestima gdje je nula ili više očekuju se parovi ključ / vrijednost (za objektne literale).

Imajmo primjer za to:

var arr1 = [1,3,6,7]; var arr2 = [5,arr1,8,9]; console.log(arr2); // [ 5, [ 1, 3, 6, 7 ], 8, 9 ]

Želim da ovo bude u jednom nizu poput [5, 1, 3, 6, 7, 8, 9].

Pomoću ove sintakse širenja mogu riješiti ovo:

var arr1 = [1,3,6,7]; var arr2 = [5,...arr1,8,9]; console.log(arr2); //[ 5, 1, 3, 6, 7, 8, 9 ]

Druga glavna upotreba Spread Syntax-e je tijekom kopiranja niza:

var arr = [1, 2, 3]; var arr2 = arr; arr2.push(4); console.log(arr2); // [ 1, 2, 3, 4 ] console.log(arr); // [ 1, 2, 3, 4 ]

Dodao sam " 4 " samo u arr2 . Ali to je promijenilo i arr.

To možemo riješiti koristeći sintaksu širenja kako slijedi ...

var arr = [1, 2, 3]; var arr2 = [...arr]; // like arr.slice() arr2.push(4); console.log(arr2); // [ 1, 2, 3, 4 ] console.log(arr); // [ 1, 2, 3]

Za više informacija o sintaksi širenja možete se obratiti MDN dokumentaciji.

Dakle, pogledajmo izazov.

function frankenSplice(arr1, arr2, n) { // It's alive. It's alive! let array2Copy = [...arr2]; array2Copy.splice(n,0, ...arr1); //console.log(array2Copy); return array2Copy; } frankenSplice([1, 2, 3], [4, 5, 6], 1);

Glavni uvjet ovog izazova je "ne bi trebao mijenjati arr1 / arr2 nakon izvršavanja funkcije".

Dakle, stvorio je niz kopiranja arr2, a pomoću metode spajanja dodajte arr1 unutar kopije arr2 koji je imenovan kao array2Copy.

Konačni zaključak:

-> Način rezanja hoće

  • vrati odabrane elemente iz niza
  • uzmi 2 argumenta
  • ne mijenjati izvorni niz

-> Splice metoda će

  • vrati uklonjene elemente niza
  • uzeti više argumenata
  • mijenja izvorni niz

Ovo je moj prvi tutorial o kodiranju - hvala na čitanju! Vaše povratne informacije pomoći će mi da oblikujem svoje kodiranje i pisanje.

Sretno kodiranje ...!

Povežite se sa mnom putem Twittera