Modern Javascript funkciók - ES6 I.

Let

A var kulcsszóhoz hasonló, változókat tudunk deklarálni vele, azonban a scope kicsit más. Amennyiben blokkon belül hozzuk létre, azaz valahogy így:

Úgy a kapcsos zárójeleken kívül az x bizony már nem lesz 1. Ha korábban deklaráltuk, akkor az előző értéket veszi fel, ha nem, akkor undefined lesz. Ha ugyanezt varral csináljuk, a blokkon belüli értékünk marad a zárás után is.

Function-scope tekintetében a let és a var között nincs igazán különbség, az elérésük ugyanolyan, a function zárásakor kívül már nem lesz elérhető az értékük.

Global-scopeban is lehet használni, egyszerűen csak blokkon és függvényen kívül hozzuk létre

const

Gyakorlatilag ugyanúgy működik mint a let, azzal az egy különbséggel, hogy csak deklarálásnál tudunk neki értéket adni. Így biztosak lehetünk abban, hogy később nem írjuk felül véletlenül.

Arrow function

Shorthand a függvény deklarációkhoz. A segítségével elhagyhatjuk a function kulcsszót egy névtelen függvénynél, illetve akár a kapcsos zárójeleket és a returnt is

Ennek az ES5-ös megfelelője így néz ki:

For/Of ciklus

Leginkább a foreachre hasonlít, egy iterable objektumon tudunk végigmenni vele:

Nem csak tömbökön működik. Például egy string is iterable, ezáltal így is használhatjuk:

Vegyük észre, hogy ebben az esetben nem a konkrét betűket, hanem annak indexeit kapjuk meg az y-ban, ezért van szükség a címzésre.

Map

kulcs-érték párokat tartalmaz, melyeknek megtartja a hozzáadási sorrendjét is:

Tartalmaz néhány beépített metódust minden létrehozott Map:

• set: érték beállítása egy kulcshoz
• get: érték lekérdezése kulccsal
• clear: map kiürítése
• delete: elem törlés kulcs alapján
• has: tartalmazza-e a megadott kulcsot a map
• entries: A kulcs-érték párokat adja vissza egy iterator objectben
• keys: ugyanaz mint az entries csak kulcsokkal
• values: ugyanaz mint a keys csak értékekkel

Ezen kívül a már megszokott forEach is működik rajta, illetve van egy size propertyje, ami az elemszámot adja vissza.

Set

Hasonló a maphoz, annyi különbséggel, hogy egyedi értékeket tárolhatunk benne, nincsenek kulcs-érték párok.

Class

Magyarul osztályként találkozhatunk vele, az objektumok számára egy sablon, belső metódusokkal és tulajdonságokkal:

A construcor mindig kötelező, a példányosításnál ez a függvény fog lefutni:

Példányosítás után pedig a beállított tulajdonságokat le tudjuk kérdezni:

Symbol

Egyedi azonosítónak használják, mely minden létrehozásnál más értéket vesz fel.

Így a Symbol által létrehozott egyedi azonosítóval kérhetjük le a truck objektum id-ját, ami csak és kizárólag a felette létrehozott Symbol objektummal működik, ha ugyan ezekkel a paraméterekkel létrehozunk egy másikat, azzal már nem fog.

Alapértelmezett értékek a paramétereknél

A függvénydeklarációknál megadható a paraméterek kezdőértéke, amely akkor állítódik be, ha oda a függvényhívásnál nem adtunk meg semmit.

Így létrehozhatunk opcionálisan megadható függvényparamétereket.

Rest paraméter

Megvizsgálhatjuk, hogy egy stringben megtalálható-e egy másik:

Így az első 2 számot fixen kiírja a write, míg a harmadikat vagy azután következőket már nem kötelező megadnunk. Ha mégis megadjuk, azokat is kiírja.

Persze önmagában is használhatjuk, abban az esetben így kezdődne a létrehozás:

String.includes()

Megvizsgálhatjuk, hogy egy stringben megtalálható-e egy másik:

Ezen kívül a startsWith() és az endsWith() metódusokkal ellenőrizhetjük, hogy a megadott szöveggel kezdődik vagy végződik-e a stringünk.

Array.from()

Tömböt csinál egy iterable objektumból.

Az ES6-nak itt nincs még vége, számos Javascript trükk épül rá amit a honlapkészítés során felhasználhatunk. Egy következő cikkben ismertetjük a további hasznos funkciókat, amelyek ezzel a szabvánnyal kerültek be a nyelvbe.