TypeScript sąsaja (Interface) vs tipas (Type): geriausios deklaravimo praktikos pasauliniams programuotojams

TypeScript, JavaScript viršrinkinys, suteikia galimybę programuotojams visame pasaulyje kurti tvirtas ir plečiamas programas naudojant statinį tipizavimą. Du pagrindiniai tipų apibrėžimo konstruktai yra sąsajos (Interfaces) ir tipai (Types). Nors jie turi panašumų, jų niuansų ir tinkamų panaudojimo atvejų supratimas yra labai svarbus norint rašyti švarų, prižiūrimą ir efektyvų kodą. Šis išsamus vadovas gilinsis į TypeScript sąsajų ir tipų skirtumus, nagrinėdamas geriausias praktikas, kaip juos efektyviai panaudoti jūsų projektuose.

TypeScript sąsajų (Interfaces) supratimas

Sąsaja (Interface) TypeScript kalboje yra galingas būdas apibrėžti objekto kontraktą. Ji nurodo objekto formą, apibrėždama savybes, kurias jis privalo turėti, jų duomenų tipus ir, pasirinktinai, metodus, kuriuos jis turėtų įgyvendinti. Sąsajos pirmiausia aprašo objektų struktūrą.

Sąsajos sintaksė ir pavyzdys

Sąsajos apibrėžimo sintaksė yra paprasta:

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,
};

Šiame pavyzdyje User sąsaja apibrėžia vartotojo objekto struktūrą. Bet koks objektas, priskirtas user kintamajam, turi atitikti šią struktūrą; priešingu atveju TypeScript kompiliatorius praneš apie klaidą.

Pagrindinės sąsajų savybės

• Objekto formos apibrėžimas: Sąsajos puikiai tinka objektų struktūrai arba „formai“ apibrėžti.
• Išplečiamumas: Sąsajas galima lengvai išplėsti naudojant extends raktinį žodį, kas leidžia naudoti paveldėjimą ir pakartotinį kodo panaudojimą.
• Deklaracijų suliejimas: TypeScript palaiko sąsajų deklaracijų suliejimą, o tai reiškia, kad galite deklaruoti tą pačią sąsają kelis kartus, ir kompiliatorius sujungs jas į vieną deklaraciją.

Deklaracijų suliejimo pavyzdys

interface Window {
  title: string;
}

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

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

Čia Window sąsaja deklaruojama du kartus. TypeScript sulieja šias deklaracijas, efektyviai sukurdama sąsają su title, height ir width savybėmis.

TypeScript tipų (Types) nagrinėjimas

Tipas (Type) TypeScript kalboje suteikia būdą apibrėžti duomenų formą. Skirtingai nuo sąsajų, tipai yra universalesni ir gali atstovauti platesniam duomenų struktūrų spektrui, įskaitant primityvius tipus, jungtis (unions), sankirtas (intersections) ir kortežus (tuples).

Tipo sintaksė ir pavyzdys

Tipo pseudonimo (alias) apibrėžimo sintaksė yra tokia:

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

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

Šiame pavyzdyje Point tipas apibrėžia taško objekto struktūrą su x ir y koordinatėmis.

Pagrindinės tipų savybės

• Jungčių tipai (Union Types): Tipai gali atstovauti kelių tipų jungtį, leidžiant kintamajam turėti skirtingų tipų reikšmes.
• Sankirtų tipai (Intersection Types): Tipai taip pat gali atstovauti kelių tipų sankirtą, sujungiant visų tipų savybes į vieną tipą.
• Primitivūs tipai: Tipai gali tiesiogiai atstovauti primityvius tipus, tokius kaip string, number, boolean ir kt.
• Kortežų tipai (Tuple Types): Tipai gali apibrėžti kortežus, kurie yra fiksuoto ilgio masyvai su konkrečiais tipais kiekvienam elementui.
• Universalesni: Gali aprašyti beveik viską, nuo primityvių duomenų tipų iki sudėtingų objektų formų.

Jungties tipo pavyzdys

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.",
};

Result tipas yra jungties tipas, kuris gali būti arba sėkmingas rezultatas su duomenimis, arba nesėkmingas su klaidos pranešimu. Tai naudinga atvaizduojant operacijų, kurios gali būti sėkmingos arba ne, rezultatus.

Sankirtos tipo pavyzdys

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",
};

EmployeePerson tipas yra sankirtos tipas, sujungiantis tiek Person, tiek Employee savybes. Tai leidžia kurti naujus tipus derinant esamus.

Pagrindiniai skirtumai: sąsaja (Interface) vs tipas (Type)

Nors tiek sąsajos, tiek tipai skirti duomenų struktūrų apibrėžimui TypeScript kalboje, yra esminių skirtumų, kurie lemia, kada naudoti vieną ar kitą:

1. Deklaracijų suliejimas: Sąsajos palaiko deklaracijų suliejimą, o tipai – ne. Jei reikia išplėsti tipo apibrėžimą per kelis failus ar modulius, paprastai teikiama pirmenybė sąsajoms.
2. Jungčių tipai: Tipai gali atstovauti jungčių tipus, o sąsajos tiesiogiai negali apibrėžti jungčių. Jei reikia apibrėžti tipą, kuris gali būti vienas iš kelių skirtingų tipų, naudokite tipo pseudonimą.
3. Sankirtų tipai: Tipai gali sukurti sankirtų tipus naudojant & operatorių. Sąsajos gali išplėsti kitas sąsajas, pasiekdamos panašų efektą, tačiau sankirtų tipai suteikia daugiau lankstumo.
4. Primitivūs tipai: Tipai gali tiesiogiai atstovauti primityvius tipus (string, number, boolean), o sąsajos pirmiausia skirtos objektų formoms apibrėžti.
5. Klaidų pranešimai: Kai kurie programuotojai mano, kad sąsajos pateikia šiek tiek aiškesnius klaidų pranešimus, palyginti su tipais, ypač dirbant su sudėtingomis tipų struktūromis.

Geriausios praktikos: pasirinkimas tarp sąsajos ir tipo

Pasirinkimas tarp sąsajų ir tipų priklauso nuo konkrečių projekto reikalavimų ir jūsų asmeninių pageidavimų. Štai keletas bendrų gairių, į kurias verta atsižvelgti:

• Naudokite sąsajas objektų formoms apibrėžti: Jei pirmiausia reikia apibrėžti objektų struktūrą, sąsajos yra natūralus pasirinkimas. Jų išplečiamumas ir deklaracijų suliejimo galimybės gali būti naudingos didesniuose projektuose.
• Naudokite tipus jungčių, sankirtų ir primityviems tipams: Kai reikia atstovauti tipų jungtį, tipų sankirtą arba paprastą primityvų tipą, naudokite tipo pseudonimą.
• Išlaikykite nuoseklumą savo kodo bazėje: Nepriklausomai nuo to, ar pasirinksite sąsajas, ar tipus, siekite nuoseklumo visame projekte. Nuoseklaus stiliaus naudojimas pagerins kodo skaitomumą ir priežiūrą.
• Apsvarstykite deklaracijų suliejimą: Jei numatote, kad reikės išplėsti tipo apibrėžimą per kelis failus ar modulius, sąsajos yra geresnis pasirinkimas dėl jų deklaracijų suliejimo funkcijos.
• Pirmenybę teikite sąsajoms viešosioms API: Projektuojant viešąsias API, dažnai teikiama pirmenybė sąsajoms, nes jos yra labiau išplečiamos ir leidžia jūsų API naudotojams lengvai išplėsti jūsų apibrėžtus tipus.

Praktiniai pavyzdžiai: pasaulinių programų scenarijai

Panagrinėkime keletą praktinių pavyzdžių, iliustruojančių, kaip sąsajos ir tipai gali būti naudojami pasaulinėje programoje:

1. Vartotojo profilio valdymas (Internacionalizacija)

Tarkime, kuriate vartotojų profilių valdymo sistemą, palaikančią kelias kalbas. Galite naudoti sąsajas vartotojų profilių struktūrai apibrėžti ir tipus skirtingiems kalbų kodams atvaizduoti:

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"; // Pavyzdiniai kalbų kodai

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" }
};

Čia UserProfile sąsaja apibrėžia vartotojo profilio struktūrą, įskaitant jo pageidaujamą kalbą. LanguageCode tipas yra jungties tipas, atstovaujantis palaikomas kalbas. Address sąsaja apibrėžia adreso formatą, darant prielaidą, kad naudojamas bendrinis pasaulinis formatas.

2. Valiutos konvertavimas (Globalizacija)

Apsvarstykite valiutų konvertavimo programą, kuri turi tvarkyti skirtingas valiutas ir keitimo kursus. Galite naudoti sąsajas valiutų objektų struktūrai apibrėžti ir tipus valiutų kodams atvaizduoti:

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

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


type CurrencyCode = "USD" | "EUR" | "GBP" | "JPY" | "CAD"; // Pavyzdiniai valiutų kodai

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

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

Currency sąsaja apibrėžia valiutos objekto struktūrą, įskaitant jo kodą, pavadinimą ir simbolį. CurrencyCode tipas yra jungties tipas, atstovaujantis palaikomus valiutų kodus. ExchangeRate sąsaja naudojama konvertavimo kursams tarp skirtingų valiutų atvaizduoti.

3. Duomenų patvirtinimas (Tarptautinis formatas)

Tvarkant duomenis, įvestus vartotojų iš skirtingų šalių, svarbu patvirtinti duomenis pagal teisingą tarptautinį formatą. Pavyzdžiui, telefono numeriai turi skirtingus formatus priklausomai nuo šalies kodo. Tipai gali būti naudojami variacijoms atvaizduoti.

type PhoneNumber = {
  countryCode: string;
  number: string;
  isValid: boolean; // Pridėkite loginę reikšmę, atspindinčią teisingus/neteisingus duomenis.
};

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


function validatePhoneNumber(phoneNumber: string, countryCode: string): PhoneNumber {
  // Patvirtinimo logika, pagrįsta šalies kodu (pvz., naudojant biblioteką, kaip libphonenumber-js)
  // ... Įgyvendinimas čia numeriui patvirtinti.
  const isValid = true; //vietos rezervavimo ženklas

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

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


console.log(contact.phoneNumber.isValid); //išvesties patvirtinimo patikrinimas.

Išvada: TypeScript deklaracijų įsisavinimas

TypeScript sąsajos ir tipai yra galingi įrankiai, skirti duomenų struktūroms apibrėžti ir kodo kokybei gerinti. Jų skirtumų supratimas ir efektyvus panaudojimas yra būtinas kuriant tvirtas, prižiūrimas ir plečiamas programas. Vadovaudamiesi šiame vadove pateiktomis geriausiomis praktikomis, galėsite priimti pagrįstus sprendimus, kada naudoti sąsajas, o kada – tipus, taip pagerindami savo TypeScript programavimo darbo eigą ir prisidėdami prie savo projektų sėkmės.

Atminkite, kad pasirinkimas tarp sąsajų ir tipų dažnai yra asmeninio pasirinkimo ir projekto reikalavimų klausimas. Eksperimentuokite su abiem požiūriais, kad rastumėte, kas geriausiai tinka jums ir jūsų komandai. TypeScript tipų sistemos galios panaudojimas neabejotinai padės sukurti patikimesnį ir lengviau prižiūrimą kodą, o tai bus naudinga programuotojams visame pasaulyje.