Al

Alapok ebben a kurzusban: JavaScript

3 feladat

A(z) Alapok fogalomról

A JavaScript dinamikus, prototípusalapú nyelv. Néhány primitív típusa van, minden más pedig objektumnak számít.

Bár leginkább weblapok szkriptnyelveként ismert, sok böngészőn kívüli környezet is használja, például a Node.js. A nyelvet aktívan fejlesztik, és mivel több paradigmát támogat, sokféle programozási stílust tesz lehetővé. A JavaScript dinamikus nyelv, amely támogatja az objektumorientált, az imperatív és a deklaratív (például funkcionális programozási) stílust.

(Újra)értékadás

Néhány fő módja van annak, hogy értéket rendelj nevekhez a JavaScriptben: használhatsz változókat vagy konstansokat. Az Exercism-ön a változókat mindig camelCase írásmóddal, a konstansokat pedig SCREAMING_SNAKE_CASE stílusban írjuk. Nincs hivatalos útmutató, amit követni kellene, és a különböző cégeknek és szervezeteknek más-más stílusútmutatójuk van. Nyugodtan írd a változókat úgy, ahogy szeretnéd. Ha úgy írod őket, ahogy a feladatok elő vannak készítve, az az előnye, hogy a webes felületen és a legtöbb IDE-ben másképp lesznek kiemelve.

A JavaScriptben a változókat a const, a let vagy a var kulcsszóval definiálhatod.

A let vagy a var használatakor egy változó az élettartama során több különböző értékre hivatkozhat. Például a myFirstVariable sokszor definiálható és újradefiniálható az = értékadó operátorral:

let myFirstVariable = 1;
myFirstVariable = 'Some string';
myFirstVariable = new SomeComplexClass();

A let-tel és a var-ral ellentétben azok a változók, amelyeket const-tal definiálunk, csak egyszer kaphatnak értéket. Így definiáljuk a konstansokat a JavaScriptben.

const MY_FIRST_CONSTANT = 10;

// Can not be re-assigned.
MY_FIRST_CONSTANT = 20;
// => TypeError: Assignment to constant variable.

Konstans értékadás

A const kulcsszót mind a változóknál, mind a konstansoknál megemlítjük. Egy másik fogalom, ami gyakran felmerül a konstansok kapcsán, a (nem) módosíthatóság.

A const kulcsszó csak a kötést teszi módosíthatatlanná, azaz egy const változónak csak egyszer adhatsz értéket. A JavaScriptben csak a primitív értékek módosíthatatlanok, a nem primitív értékek viszont továbbra is módosíthatók.

const MY_MUTABLE_VALUE_CONSTANT = { food: 'apple' };

// This is possible
MY_MUTABLE_VALUE_CONSTANT.food = 'pear';

MY_MUTABLE_VALUE_CONSTANT;
// => { food: "pear" }

Konstans érték (módosíthatatlanság)

Általános szabályként az Exercism-ön, valamint sok más szervezet és projekt stílusútmutatójában nem módosítunk olyan értékeket, amik const SCREAMING_SNAKE_CASE formátumúak. Technikailag az értékek módosíthatók, de az átláthatóság és az elvárások kezelése miatt az Exercism-ön ezt nem ajánljuk. Ha viszont muszáj kikényszeríteni, használd az Object.freeze(value) hívást.

const MY_VALUE_CONSTANT = Object.freeze({ food: 'apple' });

// This silently fails
MY_VALUE_CONSTANT.food = 'pear';

MY_VALUE_CONSTANT;
// => { food: "apple" }

A gyakorlatban ritkán látni Object.freeze-t egy kódbázis minden pontján, de az a szabály, hogy soha ne módosítsd a SCREAMING_SNAKE_CASE értékeket, jó szabály; gyakran automatizált elemzéssel, például linterrel kényszerítik ki.

Függvénydeklarációk

A JavaScriptben a funkcionalitás egységeit függvények foglalják magukba, és ha összetartoznak, általában ugyanabba a fájlba csoportosítjuk őket. Ezek a függvények fogadhatnak paramétereket (argumentumokat), és a return kulcsszóval adhatnak vissza értéket. A függvényeket a () szintaxissal hívjuk meg.

function add(num1, num2) {
  return num1 + num2;
}

add(1, 3);
// => 4

💡 A JavaScriptben sok különböző módon deklarálhatsz egy függvényt. Ezek a módszerek másképp néznek ki, mint a function kulcsszó használata. A kurzus igyekszik fokozatosan bevezetni őket, de ha már ismered őket, nyugodtan használd bármelyiket. A legtöbb esetben az egyik vagy a másik használata nem jobb vagy rosszabb.

Export és import

Az export és az import kulcsszó hatékony eszköz, amivel egy hétköznapi JavaScript-fájlból JavaScript-modul lesz. Amellett, hogy a kód szelektíven tehet közzé komponenseket, például függvényeket, osztályokat, változókat és konstansokat, egy sor más funkciót is lehetővé tesz, például:

  • Exportok és importok átnevezése, amivel elkerülheted a névütközéseket,
  • Dinamikus importok, amik igény szerint töltik be a kódot,
  • Tree shaking, ami csökkenti a végleges kód méretét azáltal, hogy eltávolítja a mellékhatás nélküli modulokat, sőt a nem használt modultartalmakat is,
  • live bindings exportálása, amivel olyan értéket exportálhatsz, ami mindenhol módosul, ahol importálták, ha az eredeti érték módosul.

Konkrét példa erre, hogyan működnek a tesztek az Exercism JavaScript-kurzusán. Minden feladatnak van legalább egy implementációs fájlja, például lasagna.js, és legalább egy tesztfájlja, például lasagna.spec.js. Az implementációs fájl export segítségével teszi közzé a nyilvános API-t, a tesztfájl pedig import segítségével fér hozzá ezekhez, így tudja tesztelni az implementáció eredményeit.

// file.js
export const MY_VALUE = 10;

export function add(num1, num2) {
  return num1 + num2;
}

// file.spec.js
import { MY_VALUE, add } from './file';

add(MY_VALUE, 5);
// => 15
Szerkesztés GitHubon A hivatkozás új ablakban vagy lapon nyílik meg

Tanuld meg a(z) Alapok fogalmat