Eesti

Põhjalik juhend TypeScript'i liidestele ja tüüpidele, uurides nende erinevusi, kasutusjuhte ja parimaid praktikaid hooldatavate ja skaleeritavate rakenduste loomiseks.

TypeScript'i Liides vs Tüüp: Deklaratsiooni Parimad Praktikad Globaalsetele Arendajatele

TypeScript, JavaScripti superkomplekt, annab arendajatele üle maailma staatilise tüüpimise kaudu võimaluse luua vastupidavaid ja skaleeritavaid rakendusi. Kaks põhilist konstruktsiooni tüüpide defineerimiseks on liidesed (Interfaces) ja tüübid (Types). Kuigi neil on sarnasusi, on nende nüansside ja sobivate kasutusjuhtude mõistmine ülioluline puhta, hooldatava ja tõhusa koodi kirjutamiseks. See põhjalik juhend süveneb TypeScript'i liideste ja tüüpide erinevustesse, uurides parimaid praktikaid nende tõhusaks kasutamiseks teie projektides.

TypeScript'i Liideste Mõistmine

Liides (Interface) TypeScriptis on võimas viis objekti lepingu defineerimiseks. See määratleb objekti kuju, täpsustades omadused, mis sel peavad olema, nende andmetüübid ja valikuliselt ka meetodid, mida see peab implementeerima. Liidesed kirjeldavad peamiselt objektide struktuuri.

Liidese Süntaks ja Näide

Liidese defineerimise süntaks on lihtne:


interface User {
  id: number;
  name: string;
  email: string;
  isActive: boolean;
}

const user: User = {
  id: 123,
  name: "Alice Smith",
  email: "alice.smith@example.com",
  isActive: true,
};

Selles näites defineerib User liides kasutajaobjekti struktuuri. Iga objekt, mis omistatakse user muutujale, peab vastama sellele struktuurile; vastasel juhul annab TypeScript'i kompilaator vea.

Liideste Põhijooned

Deklaratsioonide Ühendamise Näide


interface Window {
  title: string;
}

interface Window {
  height: number;
  width: number;
}

const myWindow: Window = {
  title: "My Application",
  height: 800,
  width: 600,
};

Siin on Window liides deklareeritud kaks korda. TypeScript ühendab need deklaratsioonid, luues tegelikult liidese, millel on title, height ja width omadused.

TypeScript'i Tüüpide Uurimine

Tüüp (Type) TypeScriptis pakub viisi andmete kuju defineerimiseks. Erinevalt liidestest on tüübid mitmekülgsemad ja võivad esindada laiemat valikut andmestruktuure, sealhulgas primitiivtüüpe, unioone, ristandeid ja ennikuid.

Tüübi Süntaks ja Näide

Tüübivõltsingu (type alias) defineerimise süntaks on järgmine:


type Point = {
  x: number;
  y: number;
};

const origin: Point = {
  x: 0,
  y: 0,
};

Selles näites defineerib Point tüüp punkti objekti struktuuri x ja y koordinaatidega.

Tüüpide Põhijooned

Unioonitüübi Näide


type Result = {
  success: true;
  data: any;
} | {
  success: false;
  error: string;
};

const successResult: Result = {
  success: true,
  data: { message: "Operation successful!" },
};

const errorResult: Result = {
  success: false,
  error: "An error occurred.",
};

Tüüp Result on unioonitüüp, mis võib olla kas edukas tulemus andmetega või ebaõnnestumine veateatega. See on kasulik operatsioonide tulemuste esitamiseks, mis võivad õnnestuda või ebaõnnestuda.

Ristandtüübi Näide


type Person = {
  name: string;
  age: number;
};

type Employee = {
  employeeId: string;
  department: string;
};

type EmployeePerson = Person & Employee;

const employee: EmployeePerson = {
  name: "Bob Johnson",
  age: 35,
  employeeId: "EMP123",
  department: "Engineering",
};

Tüüp EmployeePerson on ristandtüüp, mis kombineerib nii Person kui ka Employee omadused. See võimaldab luua uusi tüüpe olemasolevate tüüpide kombineerimisel.

Põhierinevused: Liides vs Tüüp

Kuigi nii liidesed kui ka tüübid teenivad TypeScriptis andmestruktuuride defineerimise eesmärki, on olemas olulised erinevused, mis mõjutavad, millal üht teise asemel kasutada:

  1. Deklaratsioonide Ühendamine: Liidesed toetavad deklaratsioonide ühendamist, samas kui tüübid mitte. Kui teil on vaja tüübi definitsiooni laiendada mitmes failis või moodulis, eelistatakse üldiselt liideseid.
  2. Unioonitüübid: Tüübid võivad esindada unioonitüüpe, samas kui liidesed ei saa unioone otse defineerida. Kui teil on vaja defineerida tüüp, mis võib olla üks mitmest erinevast tüübist, kasutage tüübivõltsingut.
  3. Ristandtüübid: Tüübid saavad luua ristandtüüpe, kasutades & operaatorit. Liidesed saavad laiendada teisi liideseid, saavutades sarnase efekti, kuid ristandtüübid pakuvad rohkem paindlikkust.
  4. Primitiivtüübid: Tüübid saavad otse esindada primitiivtüüpe (string, number, boolean), samas kui liidesed on peamiselt mõeldud objektide kujude defineerimiseks.
  5. Veateated: Mõned arendajad leiavad, et liidesed pakuvad veidi selgemaid veateateid võrreldes tüüpidega, eriti keeruliste tüübistruktuuridega tegelemisel.

Parimad Praktikad: Valik Liidese ja Tüübi Vahel

Valik liideste ja tüüpide vahel sõltub teie projekti spetsiifilistest nõuetest ja isiklikest eelistustest. Siin on mõned üldised juhised, mida arvesse võtta:

Praktilised Näited: Globaalsete Rakenduste Stsenaariumid

Vaatleme mõningaid praktilisi näiteid, et illustreerida, kuidas liideseid ja tüüpe saab kasutada globaalses rakenduses:

1. Kasutajaprofiilide Haldus (Rahvusvahelistamine)

Oletame, et loote kasutajaprofiilide haldussüsteemi, mis toetab mitut keelt. Saate kasutada liideseid kasutajaprofiilide struktuuri defineerimiseks ja tüüpe erinevate keelekoodide esitamiseks:


interface UserProfile {
  id: number;
  name: string;
  email: string;
  preferredLanguage: LanguageCode;
  address: Address;
}

interface Address {
    street: string;
    city: string;
    country: string;
    postalCode: string;
}

type LanguageCode = "en" | "fr" | "es" | "de" | "zh"; // Example language codes

const userProfile: UserProfile = {
  id: 1,
  name: "John Doe",
  email: "john.doe@example.com",
  preferredLanguage: "en",
  address: { street: "123 Main St", city: "Anytown", country: "USA", postalCode: "12345" }
};

Siin defineerib UserProfile liides kasutajaprofiili struktuuri, sealhulgas nende eelistatud keele. Tüüp LanguageCode on unioonitüüp, mis esindab toetatud keeli. Liides Address defineerib aadressi vormingu, eeldades üldist globaalset vormingut.

2. Valuutakonverteerimine (Globaliseerimine)

Kujutage ette valuutakonverteerimise rakendust, mis peab käsitlema erinevaid valuutasid ja vahetuskursse. Saate kasutada liideseid valuutaobjektide struktuuri defineerimiseks ja tüüpe valuutakoodide esitamiseks:


interface Currency {
  code: CurrencyCode;
  name: string;
  symbol: string;
}

interface ExchangeRate {
  baseCurrency: CurrencyCode;
  targetCurrency: CurrencyCode;
  rate: number;
}


type CurrencyCode = "USD" | "EUR" | "GBP" | "JPY" | "CAD"; // Example currency codes

const usd: Currency = {
  code: "USD",
  name: "United States Dollar",
  symbol: "$",
};

const exchangeRate: ExchangeRate = {
  baseCurrency: "USD",
  targetCurrency: "EUR",
  rate: 0.85,
};

Liides Currency defineerib valuutaobjekti struktuuri, sealhulgas selle koodi, nime ja sümboli. Tüüp CurrencyCode on unioonitüüp, mis esindab toetatud valuutakoode. Liidest ExchangeRate kasutatakse erinevate valuutade vaheliste konverteerimiskursside esitamiseks.

3. Andmete Valideerimine (Rahvusvaheline Vorming)

Erinevatest riikidest pärit kasutajate andmete sisestamisel on oluline valideerida andmeid vastavalt õigele rahvusvahelisele vormingule. Näiteks on telefoninumbritel riigikoodist sõltuvalt erinevad vormingud. Variatsioonide esitamiseks saab kasutada tüüpe.


type PhoneNumber = {
  countryCode: string;
  number: string;
  isValid: boolean; // Add a boolean to represent valid/invalid data.
};

interface Contact {
   name: string;
   phoneNumber: PhoneNumber;
   email: string;
}


function validatePhoneNumber(phoneNumber: string, countryCode: string): PhoneNumber {
  // Validation logic based on countryCode (e.g., using a library like libphonenumber-js)
  // ... Implementation here to validate number.
  const isValid = true; //placeholder

  return { countryCode, number: phoneNumber, isValid };
}

const contact: Contact = {
    name: "Jane Doe",
    phoneNumber: validatePhoneNumber("555-123-4567", "US"), //example
    email: "jane.doe@email.com",
};


console.log(contact.phoneNumber.isValid); //output validation check.

Kokkuvõte: TypeScript'i Deklaratsioonide Valdamine

TypeScript'i liidesed ja tüübid on võimsad tööriistad andmestruktuuride defineerimiseks ja koodi kvaliteedi parandamiseks. Nende erinevuste mõistmine ja tõhus kasutamine on oluline vastupidavate, hooldatavate ja skaleeritavate rakenduste loomiseks. Järgides selles juhendis toodud parimaid praktikaid, saate teha teadlikke otsuseid, millal kasutada liideseid ja millal tüüpe, parandades lõppkokkuvõttes oma TypeScript'i arendustöövoogu ja aidates kaasa oma projektide edule.

Pidage meeles, et valik liideste ja tüüpide vahel on sageli isikliku eelistuse ja projekti nõuete küsimus. Katsetage mõlema lähenemisviisiga, et leida, mis sobib teile ja teie meeskonnale kõige paremini. TypeScript'i tüübisüsteemi võimsuse omaksvõtmine viib kahtlemata usaldusväärsema ja hooldatavama koodini, millest on kasu arendajatele üle maailma.

TypeScript'i Liides vs Tüüp: Deklaratsiooni Parimad Praktikad Globaalsetele Arendajatele | MLOG