Gyakorlat – Osztály létrehozása

  • 5 perc

Osztály létrehozásához adja meg a tagjait: tulajdonságok, a constructor, tartozékok és metódusok.

Hozzunk létre egy új osztályt.Car Az osztályt önállóan is használhatja Car alapszintű Car objektumok létrehozásához, vagy kibővítheti az Car osztályt, hogy új osztályokat hozzon létre bizonyos típusú autókhoz, például egy GasCar vagy egy ElectricCar osztályhoz. Ezek az osztályok öröklik az osztály tulajdonságait és metódusait Car , valamint saját tulajdonságokkal és metódusokkal rendelkeznek.

  1. Nyissa meg a Játszótért , és távolítsa el a meglévő kódot.

  2. Hozzon létre egy újat class a class kulcsszó és az osztálynév használatával. Car Konvenció szerint az osztálynevek PascalCaseek. Fűzzünk hozzá néhány megjegyzést is, hogy egyszerűbb legyen az osztálytagok felvétele a megfelelő helyekre.

    class Car {
    // Properties

    // Constructor

    // Accessors

    // Methods

}

Osztálytulajdonságok deklarálása

Az osztály tulajdonságait úgy tekintheti, mint az objektumnak az inicializáláskor átadott nyers adatokat.

Az osztály tulajdonságai minden Car autóra vonatkoznak, függetlenül az adott típustól vagy modelltől. Ilyen tulajdonságok lehetnek például az autó, a szín és az ajtók száma. Mivel a TypeScriptben dolgozik, típusattribútumokat is alkalmazhat a tulajdonságokra.

  1. Deklarálja az osztály három tulajdonságát Car : _make: string, _color: stringés _doors: number.

    // Properties
_make: string;
_color: string;
_doors: number;

Az osztálykonstruktor definiálása

A TypeScript osztályai két külön típust hoznak létre: a példánytípust, amely meghatározza, hogy egy osztálypéldány mely tagjaival rendelkezik, és a constructor függvény típusa, amely meghatározza, hogy az osztályfüggvény constructor mely tagjaival rendelkezik. A constructor függvénytípust "statikus oldal" típusnak is nevezik, mivel az osztály statikus tagjait is tartalmazza.

A használat constructor egyszerűbbé teheti az osztályokat, és egyszerűbbé teheti őket, ha sok osztálysal dolgozik.

A constructor függvény inicializálja az osztály tulajdonságait, és három részből áll:

  • Az constructor kulcsszóból.
  • Egy paraméterlista, amely meghatározza azokat a paramétereket, amelyeket az új példány létrehozásakor az új objektumnak ad át. A paraméterlista meghatározásakor ne feledje, hogy:
    • Nem szükséges paramétert definiálni az osztály minden tulajdonságához.
    • Mint minden TypeScript-függvénynél, a paraméterek kötelezőek vagy nem kötelezők, alapértelmezett értékekkel vagy rest paraméterekkel rendelkeznek. (Ez a JavaScript fő különbsége.)
    • A paraméternevek eltérhetnek a tulajdonságnevektől. Ne feledje, hogy ezek a nevek megjelennek az Intellisense-ben, amikor ilyen típusú objektumokkal dolgozik, ezért megfelelően leíró neveket használjon.
  • A tulajdonság-hozzárendelések. Minden utasítás egy paraméter értékét rendeli egy tulajdonság értékéhez. Ha azt szeretné jelezni, hogy az osztály egy tagját éri el (ebben az esetben a tulajdonságot), alkalmazza a kulcsszót this. .

Egy osztály legfeljebb egy deklarációt constructor tartalmazhat. Ha egy osztály nem constructor tartalmaz deklarációt, a rendszer automatikus konstruktort biztosít.

Folytassa az osztály definiálása a Car Játszótéren.

  1. Hozza létre az constructorCar osztályt. Kezdje a constructor kulcsszóval, majd határozza meg azokat a paramétereket és típusokat, amelyeket az új példány létrehozásakor az új Car objektumnak ad át. Az Car osztályhoz adjon meg egy paramétert mindhárom tulajdonsághoz, és írja be a típussal. doors A paraméter megadása nem kötelező, ha az alapértelmezett érték a következő4: .

  2. A kódblokkban constructorrendeljen hozzá egy paraméterértéket minden tulajdonsághoz (például this._make = make). Ebben az esetben állítsa be a társított paraméter értékére, de vegye figyelembe, hogy bármely olyan kifejezést hozzárendelhet, amely a szükséges típust adja vissza.

    // Constructor
constructor(make: string, color: string, doors = 4) {
    this._make = make;
    this._color = color;
    this._doors = doors;
}

Tipp.

A tulajdonságnév előtti aláhúzás (_) nem kötelező a tulajdonságdeklarációban, de lehetővé teszi a tulajdonságdeklaráció megkülönböztetését a konstruktoron keresztül elérhető paraméterektől, miközben vizuálisan továbbra is összekapcsolja a kettőt.

A tartozékok meghatározása

Bár az osztálytulajdonságokat közvetlenül érheti el (alapértelmezés szerint ezek public), a TypeScript támogatja a gettereket/beállítókat a tulajdonsághoz való hozzáférés elfogásának módjaként. Így részletesebben szabályozhatja, hogy a tagok hogyan férnek hozzá az egyes objektumokhoz.

Az objektum tagjainak a kódból való visszaadásához set vagy visszaadásához az osztályban meg kell határoznia get és set mellékelnie kell azokat.

Folytassa az osztály definiálása a Car Játszótéren.

  1. Adjon meg egy blokkot get annak a make paraméternek, amely a tulajdonság értékét _make adja vissza.

    // Accessors
get make() {
    return this._make;
}

  2. Adjon meg egy blokkot set a make paraméterhez, amely a _make tulajdonság értékét a make paraméter értékére állítja.

    set make(make) {
    this._make = make;
}

  3. Használhatja és set letilthatja az get adatok érvényesítését, korlátozásokat írhat elő, vagy egyéb módosításokat hajthat végre az adatokon, mielőtt visszaküldené őket a programnak. Definiálja get és set blokkolja a color paramétert, de ezúttal egy, a tulajdonság értékéhez _color összefűzött sztringet ad vissza.

    get color() {
    return 'The color of the car is ' + this._color;
}
set color(color) {
    this._color = color;
}

  4. Definiálja get és set blokkolja a paramétert doors . A tulajdonság értékének _doors visszaadása előtt ellenőrizze, hogy a doors paraméter értéke páros szám-e. Ha nem, hibajelzést ad.

    get doors() {
    return this._doors;
}
set doors(doors) {
    if ((doors % 2) === 0) {
        this._doors = doors;
    } else {
        throw new Error('Doors must be an even number');
    }
}

Osztálymódszerek definiálása

Bármilyen TypeScript-függvényt definiálhat egy osztályon belül, és metódusként hívhatja meg az objektumon vagy az osztályon belüli egyéb függvényekből. Ezek az osztálytagok ismertetik azokat a viselkedéseket, amelyeket az osztály el tud végezni, és el tudja végezni az osztály által igényelt egyéb feladatokat.

Folytassa az osztály definiálása a Car Játszótéren.

  1. Adja meg a következő négy metódust az Car osztályhoz: accelerate, brake, turnés worker. Észre fogja venni, hogy nincs function kulcsszó. Ez nem kötelező vagy nem engedélyezett az osztályban lévő függvények definiálásakor, ezért segít tömören tartani a szintaxist.

    // Methods
accelerate(speed: number): string {
    return `${this.worker()} is accelerating to ${speed} MPH.`
}
brake(): string {
    return `${this.worker()} is braking with the standard braking system.`
}
turn(direction: 'left' | 'right'): string {
    return `${this.worker()} is turning ${direction}`;
}
// This function performs work for the other method functions
worker(): string {
    return this._make;
}