Tyyppivartijat
Käsittele turvallisesti unknown- tai any-tyyppejä tyyppivartijoiden avulla
Tyyppivartijat on ilmainen TypeScript Academy-oppitunti CoddyKitissä. Tämä on oppitunti 4/4. Voit lukea koko oppitunnin alta ilmaiseksi ja harjoitella sen jälkeen käytännössä selaimessa sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla. Oppitunti kuuluu TypeScript Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. TypeScript Academy-kurssilla on yhteensä 4 oppituntia.
Johdatus tyyppivartijoihin
Tyyppivartijat
Tervetuloa seuraavalle oppitunnille! Tällä oppitunnilla opitte tyyppivartijoista, jotka ovat TypeScriptin tehokas ominaisuus ja joiden avulla tyyppejä voidaan rajata suorituksen aikana. Tyyppivartijat varmistavat koodin tyyppiturvallisuuden ja auttavat välttämään virheitä. Tutustutaan aiheeseen!
Mitä tyyppivartijat ovat?
Tyyppivartija on funktio tai rakenne, joka määrittää muuttujan tyypin suorituksen aikana. Sen avulla TypeScript voi tarkentaa muuttujan tyyppiä tietyssä koodilohkossa.
Esimerkki:
Tehtävä: Kirjoittakaa funktio, joka tarkistaa tyyppivartijan avulla, onko arvo luku.
function isString(value: unknown): boolean {
return typeof value === "string";
}
function printLength(value: unknown): void {
if (isString(value)) {
console.log(value.length);
// TypeScript knows 'value' is a string here
} else {
console.log("Value is not a string");
}
}
printLength("Hello");
// Output: 5
printLength(42);
// Output: Value is not a string
Primitiivien käsittely <code>typeof</code>-operaattorilla
typeof-operaattorin avulla voitte tarkistaa primitiivisten arvojen, kuten merkkijonojen, lukujen ja totuusarvojen, tyypin.
Esimerkki:
Tehtävä: Erottakaa typeof-operaattorin avulla merkkijono ja luku toisistaan funktiossa.
function printValue(value: string | number): void {
if (typeof value === "string") {
console.log(`String value: ${value}`);
} else {
console.log(`Number value: ${value}`);
}
}
printValue("Hello");
// Output: String value: Hello
printValue(42);
// Output: Number value: 42
Luokkien käsittely <code>instanceof</code>-operaattorilla
instanceof-operaattori tarkistaa, onko objekti tietyn luokan ilmentymä. Esimerkki:
Tehtävä: Käsitelkää funktiossa eri luokkien ilmentymiä instanceof-operaattorin avulla.
class Dog {
bark(): void {
console.log("Woof!");
}
}
class Cat {
meow(): void {
console.log("Meow!");
}
}
function makeSound(animal: Dog | Cat): void {
if (animal instanceof Dog) {
animal.bark();
} else {
animal.meow();
}
}
let dog = new Dog();
let cat = new Cat();
makeSound(dog);
// Output: Woof!
makeSound(cat);
// Output: Meow!
Mukautettujen tyyppivartijoiden käyttö
Voitte luoda mukautettuja tyyppivartijafunktioita käyttämällä palautustyyppiä value is Type. Esimerkki:
interface Car {
make: string;
model: string;
}
interface Bike {
brand: string;
type: string;
}
function isCar(vehicle: Car | Bike): vehicle is Car {
return (vehicle as Car).make !== undefined;
}
function printVehicle(vehicle: Car | Bike): void {
if (isCar(vehicle)) {
console.log(`Car: ${vehicle.make} ${vehicle.model}`);
} else {
console.log(`Bike: ${vehicle.brand} ${vehicle.type}`);
}
}
let car: Car = { make: "Toyota", model: "Corolla" };
let bike: Bike = { brand: "Yamaha", type: "Sport" };
printVehicle(car);
// Output: Car: Toyota Corolla
printVehicle(bike);
// Output: Bike: Yamaha Sport
Diskriminoidut unionit
Diskriminoiduissa unioneissa tyyppien erottamiseen käytetään yhteistä ominaisuutta. Esimerkki:
interface Circle {
kind: "circle";
radius: number;
}
interface Rectangle {
kind: "rectangle";
width: number;
height: number;
}
type Shape = Circle | Rectangle;
function calculateArea(shape: Shape): number {
if (shape.kind === "circle") {
return Math.PI * shape.radius ** 2;
} else {
return shape.width * shape.height;
}
}
let circle: Circle = { kind: "circle", radius: 5 };
let rectangle: Rectangle = { kind: "rectangle", width: 10, height: 20 };
console.log(calculateArea(circle));
// Output: 78.53981633974483
console.log(calculateArea(rectangle));
// Output: 200
Kattavuuden tarkistus
Kattavuuden tarkistus varmistaa, että diskriminoidun unionin kaikki mahdolliset tapaukset käsitellään. Esimerkki:
function getShapeInfo(shape: Shape): string {
switch (shape.kind) {
case "circle":
return `Circle with radius ${shape.radius}`;
case "rectangle":
return `Rectangle with dimensions ${shape.width}x${shape.height}`;
default:
// This line ensures all cases are handled
const _exhaustiveCheck: never = shape;
return _exhaustiveCheck;
}
}
Yleisiä virheitä
Seuraavat ovat yleisiä virheitä tyyppivartijoita käytettäessä:
- Unionityypin kaikkien tapausten unohtaminen.
- Tyyppivartijan käyttämättä jättäminen ehdollisen logiikan kaikissa haaroissa.
as-lausekkeen virheellinen käyttö tyyppien muuntamiseen ilman asianmukaisia tarkistuksia.
Vinkki: Käyttäkää aina tyyppivartijoita tyyppien rajaamiseen ennen niiden erityisten ominaisuuksien tai metodien käyttöä!
Hienoa työtä!
Onneksi olkoon! Olette oppineet käyttämään TypeScriptin tyyppivartijoita tyyppien rajaamiseen suorituksen aikana ja tyyppiturvallisuuden varmistamiseen. Tyyppivartijat ovat olennaisia monimutkaisten unionityyppien käsittelyssä ja vankan, virheettömän koodin luomisessa. Seuraavalla oppitunnilla tutustumme edistyneisiin mapattuihin tyyppeihin. Jatketaan koodaamista!
Opi TypeScript tekoälytuutorin avulla — ilmaiseksi
Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.
- Kurssit
- 101
- Oppitunnit
- 352
Usein kysytyt kysymykset
Onko oppitunti ”Tyyppivartijat” ilmainen?
Kyllä – oppitunnin ”Tyyppivartijat” koko tekstin voi lukea täällä verkossa ilmaiseksi. Jos haluat harjoitella interaktiivisesti sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla sekä avata koko TypeScript Academy-kurssin, päivitä CoddyKit PROhon. TypeScript Academy-kurssilla on yhteensä 4 oppituntia.
Mitä opin oppitunnilla ”Tyyppivartijat”?
Käsittele turvallisesti unknown- tai any-tyyppejä tyyppivartijoiden avulla Harjoittelet TypeScript Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.
Tarvitsenko kokemusta aloittaakseni TypeScript Academy-opiskelun?
Aiempi kokemus ei ole tarpeen. CoddyKitin TypeScript Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 4/4.
Kuinka kauan ”Tyyppivartijat”-oppitunnin suorittaminen kestää?
Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.
Voinko kirjoittaa ja suorittaa koodia tällä TypeScript Academy-oppitunnilla?
Kyllä. Jokainen TypeScript Academy-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.