Bevezetés a Spread szintaxisba a JavaScript-ben

Mi ez és miért van szükségünk rá?

A terjedési szintaxist bevezették a JavaScript ES6 specifikációjába. Azóta értékes kóddarabnak bizonyult, amely tisztává és könnyen érthetővé teszi a kódot.

MDN definiálja ... , mint:

A Spread szintaxis lehetővé teszi egy iterálható elem, például egy tömb kifejezés vagy karakterlánc kibővítését olyan helyeken, ahol nulla vagy több argumentum (függvényhívás esetén) vagy elem (tömb literál esetén) várható, vagy egy objektum kifejezés kibővítését olyan helyeken, ahol nulla vagy több kulcs-érték párok (objektum literálok esetén) várhatók.

Egyetértünk mindannyian abban, hogy a fenti meghatározás egy maroknyi, és egyikünk sem fogott szót, amelyet megpróbál mondani. Tehát kezdjük a terjedés szintaxisával kapcsolatos legalapvetőbb dolgokkal.

  • A spread operátor csak 3 pont ...
  • Használható olyan iterable-n, mint egy tömb vagy egy string.
  • Egy iterálhatót bővít az egyes elemeire
  • Funkcióhívást nyújthat egy tömb (vagy bármely más iterálható) esetén, ahol 0 vagy több argumentum várható.

Példa

Az alábbi kódrészlet egy sum nevű függvényt tartalmaz, amely 3 x, y és z argumentumra számít. Van egy 3 elemből álló tömbünk, és a tömb elemeit szeretnénk átadni a függvény argumentumaként.

A spread operátor bevezetése előtt ezt az alkalmazás funkcióval hajtották végre.

A spread operátor bevezetése után nagyon egyszerűen megtehető:

Amint az a fenti részletből kiderül a spread operátorral, nem kell használnunk az Apply függvényt. Ez megment minket attól, hogy további kódokat írjunk.

A fenti példa nagyon durva és rövid elképzelést ad a szóráskezelőről. Először térjünk ki részletesebben ugyanarra, majd további példákat fogunk látni.

Szintaxis

A spread operátor sokféleképpen és szcenáriókban használható, mint pl

  • Belső funkcióhívások

A fenti forgatókönyv használatakor a többi paramétert hívjuk. Az ehhez kapcsolódó példákat a példák részben láthatjuk.

  • Tömb / iterable létrehozása / kiterjesztése:

Példák

  • Pihenésként

… A variadikus függvény argumentumaként szolgál. A variadikus függvény egy olyan függvény, amelynek változó számú paramétere lehet.

Itt, amikor visszatérünk az argszal, látjuk, hogy visszakapjuk a tömböt, amelyet külön értékként adtunk át a hívásban. Ez azt mutatja, hogy a többi operátor valójában pontosan az ellenkezőjével működik, mint a terjedés szintaxisa. Az egyik kitágul és a másik sűríti az értéket.

Még egy dologra kell felhívni a figyelmet, hogy a függvénydefinícióban nincs megadva meghatározott számú paraméter. Ez azt jelenti, hogy ... a függvénynek n számú argumentuma lehet. Nem szükséges előre megadnunk a paramétereket.

Ez különösen nagyon rugalmas módja az argumentumok fogadásának egy olyan függvény esetében, amelynél nincs meghatározva az adott argumentumszám, például a Math.max és a Math.min függvény. Variadikus függvények, mivel a bemenetek száma végtelen lehet számukra.

Vissza a példához, hogy megkapjuk az összes argumentum összegét

Meg kell iterálnunk a tömböt, és hozzá kell adnunk az összes elemet az eredmény eléréséhez.

  • Tolja elemeit egy tömbben

A push () függvényt az elemek tömbbe tolására használják. A tolással korlátozás az, hogy az elemeket egyenként kell tolnunk (push (1,2,3)). Ha van egy tömb, amelynek elemeit be kell illeszteni a tömbbe push használatával, akkor egy többdimenziós tömböt kapunk, amelyet nem kértünk.

Ismét alkalmazza a mentést

Mint láthatjuk, hogy az Apply használata nem tűnik túl elegánsnak, és ehhez egy egyszerű és kicsi szintaxisra van szükségünk. Használjuk a spread-et…

Elegáns!

  • Tömb másolása

Egyszerű!

Ugyanez az eredmény előállítható egy objektum segítségével

  • 2 tömb összefűzése

Az összefűzés a konkat függvény segítségével történik

Ugyanez érhető el a… operátorral

  • Karakterlánc átalakítása tömbgé

Ez mind a split funkció, mind a… operátor segítségével megtehető

  • Használja max és min funkciókban

Az alábbi kódrészlet általában megtalálja a tömb maximális elemét, ezért a függvényben átadjuk az egész tömböt, de az eredményt NaN-ként kapjuk meg

Használhatjuk az alkalmazást, de az előző példákból kitűnik, hogy utálom használni

Min

Következtetés

Sok olyan helyzetet láttunk, amikor a spread operátor jól jön, csökkenti a kódunkat, és rendkívül könnyen érthetővé teszi.

Ha tetszik Clap? és kövesse? többért.