Çfarë është TypeScript? Udhëzues i thjeshtë për jo-programuesit

TypeScript është JavaScript me tipe. Shtoni etiketa që thonë çfarë lloj të dhënash duhet të jetë çdo vlerë — një numër, tekst, një listë porosish — dhe TypeScript e kontrollon kodin tuaj për mospërputhje përpara se të ekzekutohet. Sajti i TypeScript e përshkruan si “JavaScript me sintaksë për tipe”; tipet hiqen kur kodi kthehet në JavaScript të zakonshëm, që pastaj ekzekutohet kudo ku ekzekutohet JavaScript.

Pse ka rëndësi kur ndërtoni me AI

Modelet e AI-së shkruajnë kod shpejt, dhe kodi i shpejtë ka gabime: një fushë e quajtur customerName në një skedar dhe customer_name në një tjetër, një çmim i dërguar si tekst në vend të numrit, një funksion i thirrur pa një vlerë. Në JavaScript të thjeshtë, shumë nga këto gabime shfaqen vetëm kur dikush klikon butonin e gabuar.

TypeScript kap shumë prej tyre më herët, ndërsa kodi shkruhet:

• AI merr reagim të menjëhershëm. Gabimet e tipit tregojnë rreshtin e saktë që është gabim, kështu që agjenti mund ta rregullojë përpara se ta shihni ju.
• Ndryshimet janë më të sigurta. Riemërtoni një fushë, dhe TypeScript shënon çdo vend që përdor ende emrin e vjetër.
• Kodi shpjegon veten. Tipet dokumentojnë çfarë pret dhe çfarë kthen një funksion, gjë që ndihmon ju, AI-në dhe çdo zhvillues që e punon më vonë.
• Redaktorët bëhen më të zgjuar. Plotësimi automatik dhe “shko te përkufizimi” funksionojnë më mirë, sepse redaktori e di çfarë është çdo vlerë.

Ky është një arsye e madhe pse shumë ndërtues aplikacionesh me AI e përdorin TypeScript si parazgjedhje.

Një analogji e përditshme

Mendoni për një depo transporti me kuti të etiketuara. Çdo kuti ka një tabelë: “Vetëm paleta”, “E ftohtë”, “Maks. 500 kg”. Kur mbërrin një dërgesë, një kontrollues në derë e krahason mallin me tabelën. Peshku i ngrirë që shkon në kutinë e produkteve të thata ndalohet te dera, jo zbulohet një javë më vonë kur erën.

TypeScript është kontrolluesi te dera. Tipet janë tabelat. Kontrolli ndodh përpara se mallrat — kodi juaj — të përdoren. Dhe pasi gjithçka është në vend, tabelat hiqen: JavaScript që ekzekutohet nuk ka më tipe brenda.

Si funksionon TypeScript

1. Ju (ose AI-ja) shkruani skedarë .ts ose .tsx — TypeScript, me etiketa tipesh.
2. Kontrolluesi i tipeve e lexon kodin dhe raporton mospërputhjet si gabime në redaktor ose në ndërtim.
3. Një hap ndërtimi heq tipet, duke prodhuar JavaScript të thjeshtë.
4. JavaScript-i ekzekutohet në shfletues ose në server (Node.js, Deno, Bun).

Një pasojë e rëndësishme: TypeScript kontrollon kodin që keni shkruar, jo të dhënat që vijnë ndërsa aplikacioni po punon. Nëse një API e jashtme kthen diçka të papritur, TypeScript nuk e sheh, përveç nëse shtoni validim gjatë ekzekutimit.

Një shembull i punuar: një formular rezervimi

Supozoni se po ndërtoni një aplikacion rezervimi për një sallon flokësh. Ja një tip që përshkruan një rezervim:

type Booking = {
  id: number;
  customerEmail: string;
  service: "haircut" | "colour" | "blow-dry";
  startsAt: Date;
  price: number;
  notes?: string; // ? do të thotë opsionale
};

Dhe një funksion që llogarit një depozitë:

function depositFor(booking: Booking): number {
  return booking.price * 0.2;
}

Tani shikoni çfarë kap TypeScript.

Një fushë me shkrim të gabuar.

depositFor({ id: 1, customerEmail: "lena@example.com", service: "haircut",
  startsAt: new Date(), prise: 40 });

TypeScript raporton se prise nuk është veti e njohur dhe price mungon. Në JavaScript të thjeshtë, kjo do të llogariste në heshtje një depozitë NaN (jo numër).

Lloji i gabuar i vlerës.

const booking: Booking = { ...otherFields, price: "40" };

TypeScript raporton se një varg nuk mund të përdoret aty ku pritet një numër. Pa të, "40" * 0.2 rastësisht funksionon, por "40" + 5 jep "405" — lloj gabimi që del në një faturë.

Një shërbim që nuk ekziston.

const booking: Booking = { ...otherFields, service: "perm" };

TypeScript raporton se "perm" nuk është një nga shërbimet e lejuara. Kur salloni më vonë shton perma, e shtoni te tipi dhe TypeScript shfaq çdo vend që duhet përditësuar — lista e çmimeve, formulari, ngjyrat e kalendarit.

Çfarë nuk mund të kapë. Nëse formulari i rezervimit dërgon price: "40" nga shfletuesi te serveri, TypeScript në server nuk e sheh këtë gjatë ekzekutimit. Prandaj aplikacionet e mirë-ndërtuara validojnë edhe të dhënat që vijnë, shpesh me një bibliotekë validimi që kontrollon formën dhe e kthen në një Booking të saktë.

TypeScript kundrejt JavaScript

Terma të shpjeguara

Gabime dhe keqkuptime të zakonshme

• “TypeScript e bën kodin pa gabime.” Kap mospërputhje në formën e të dhënave, jo logjikë të gabuar. Një depozitë 2% në vend të 20% kalon kontrollin e tipit pa problem.
• “Tipet më mbrojnë nga të dhënat e këqija.” Tipet zhduken gjatë ekzekutimit. Validoni të dhënat nga përdoruesit, formularët dhe API-të.
• any kudo. Kur AI-ja është bllokuar, mund të kapet për any ose // @ts-ignore për t'i heshtur gabimet. Kjo i fsheh problemet në vend që t'i zgjidhë.
• Injorimi i gabimeve të tipit sepse preview-ja punon. Disa mjete ekzekutojnë ende kod me gabime tipi. Gabimet janë ende të gatshme të bëhen probleme.
• “TypeScript është më i ngadaltë.” Tipet hiqen para ekzekutimit; JavaScript që ekzekutohet është thelbësisht i njëjtë.
• “Është vetëm për ekipe të mëdha.” Ndërtuesit solo përfitojnë edhe ata, sidomos kur AI-ja bën shumicën e ndryshimeve.

Çfarë t'i kërkoni ndërtuesit tuaj me AI

• “Përdor TypeScript me modalitetin strict të ndezur.”
• “Përcakto tipe të përbashkëta për regjistrimet tona kryesore — Customer, Booking, Invoice — dhe përdorile si në frontend ashtu edhe në backend.”
• “Mos përdor any ose @ts-ignore për të kaluar gabimet; zgjidh problemin themelor dhe më trego se cili ishte.”
• “Valido të gjitha të dhënat që vijnë në server, jo vetëm me tipe.”
• “Ekzekuto kontrollin e tipeve dhe rregullo çdo gabim përpara se të më thuash që është gati.”
• “Kur riemërton një fushë, përditëso çdo vend që e shënon TypeScript.”
• “Shpjego këtë gabim tipi thjesht.”

Për të kontrolluar atë që prodhoi AI-ja, shihni si të rishikoni kodin e gjeneruar nga AI dhe si të korrigjoni një aplikacion të ndërtuar me AI.

TypeScript në Mythex

Kur nuk kërkoni diçka specifike, Mythex i fillon projektet e reja me Vite + React + TypeScript + Tailwind. Redaktori i kodit përfshin inteligjencën e gjuhës — plotësime, diagnostikim dhe shko te përkufizimi për TypeScript dhe JavaScript, mes gjuhëve të tjera — kështu që gabimet e tipit shihen në kod, jo vetëm në preview. Redaktori është vetëm për lexim në Free dhe plotësisht i redaktueshëm në Pro. Mund të kërkoni një konfigurim tjetër në kërkesën tuaj të parë; faqja e dokumentacionit për si zgjidhet teknologjia shpjegon si, dhe dokumentacioni i redaktorit të kodit mbulon çfarë shfaq redaktori.

Pyetje