Hvað er TypeScript? Einföld leiðsögn fyrir ófaglærða

TypeScript er JavaScript með gerðum. Þú bætir við merkimiðum sem segja hvers konar gögn hvert gildi á að vera (tölu, texta, lista yfir pantanir) og TypeScript athugar kóðann þinn með tilliti til ósamræmis áður en hann keyrir. TypeScript-síðan lýsir því sem „JavaScript með setningafræði fyrir gerðir“. Gerðirnar eru fjarlægðar þegar kóðinn er breytt í venjulegt JavaScript, sem síðan keyrir hvar sem JavaScript keyrir.

Af hverju þetta skiptir máli þegar þú smíðar með gervigreind

Gervigreindarmódel skrifa kóða hratt og hraður kóði hefur mistök: reitur sem heitir customerName í einni skrá og customer_name í annarri, verð sent sem texti í stað tölu, fall kallað án gildis. Í venjulegu JavaScript koma mörg þessara mistaka ekki í ljós fyrr en einhver smellir á rangan hnapp.

TypeScript grípur mörg þeirra fyrr, meðan kóðinn er skrifaður:

• Gervigreindin fær tafarlausa endurgjöf. Gerðavillur benda á nákvæmu línuna sem er röng, svo agentinn getur lagað hana áður en þú sérð hana.
• Breytingar eru öruggari. Þegar þú endurnefnir reit merkir TypeScript alla staði sem nota enn gamla nafnið.
• Kóðinn útskýrir sig sjálfur. Gerðir skjalfesta hvað fall býst við og skilar, sem hjálpar þér, gervigreindinni og öllum forriturum sem vinna í því síðar.
• Ritlar verða snjallari. Sjálfvirk útfylling og „fara að skilgreiningu“ virka betur því ritillinn veit hvert gildi er.

Þetta er stór ástæða þess að margir AI-smiðir nota TypeScript sjálfgefið.

Hversdagsdæmi

Hugsaðu um vöruhús með merktum básum. Hver bás er með skilti: „Aðeins bretti“, „Kælt“, „Hámark 500 kg“. Þegar vörusending kemur ber eftirlitsmaður við dyrnar vöruna saman við skiltið. Frosinn fiskur sem á að fara í þurrvörubásinn er stöðvaður við dyrnar, ekki uppgötvaður viku síðar þegar hann lyktar.

TypeScript er eftirlitsmaðurinn við dyrnar. Gerðirnar eru skiltin. Athugunin fer fram áður en vörurnar, það er kóðinn þinn, fara í notkun. Og þegar allt er komið fyrir eru skiltin fjarlægð: keyrandi JavaScript hefur engar gerðir eftir í sér.

Hvernig TypeScript virkar

1. Þú (eða gervigreindin) skrifar .ts- eða .tsx-skrár, TypeScript með gerðamerkimiðum.
2. Gerðaathugunin les kóðann og tilkynnir ósamræmi sem villur í ritlinum eða smíðinni.
3. Smíðaskref fjarlægir gerðirnar og býr til venjulegt JavaScript.
4. JavaScriptið keyrir í vafranum eða á þjóni (Node.js, Deno, Bun).

Mikilvæg afleiðing: TypeScript athugar kóðann sem þú skrifaðir, ekki gögnin sem berast meðan appið keyrir. Ef ytra API skilar einhverju óvæntu sér TypeScript það ekki nema þú bætir við staðfestingu meðan appið keyrir.

Dæmi: bókunareyðublað

Segjum að þú sért að smíða bókunarapp fyrir hárgreiðslustofu. Hér er gerð sem lýsir bókun:

type Booking = {
  id: number;
  customerEmail: string;
  service: "haircut" | "colour" | "blow-dry";
  startsAt: Date;
  price: number;
  notes?: string; // ? þýðir að reiturinn er valfrjálsur
};

Og fall sem reiknar út staðgreiðslu (innborgun):

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

Núna sérðu hvað TypeScript grípur.

Rangt stafsettur reitur.

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

TypeScript tilkynnir að prise sé ekki þekktur eiginleiki og að price vanti. Í venjulegu JavaScript myndi þetta þegjandi reikna staðgreiðslu sem NaN (ekki tölu).

Rangt tegund gildis.

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

TypeScript tilkynnir að texti geti ekki verið þar sem tala er gerð ráð fyrir. Án þess virkar "40" * 0.2 óvart, en "40" + 5 gefur "405", sú villa sem birtist á reikningi.

Þjónusta sem er ekki til.

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

TypeScript tilkynnir að "perm" sé ekki ein af leyfðu þjónustunum. Þegar stofan bætir síðar við permanenti bætirðu henni við gerðina, og TypeScript sýnir alla staði sem þurfa uppfærslu: verðlistann, eyðublaðið, dagatalslitina.

Það sem það getur ekki grípið. Ef bókunareyðublaðið sendir price: "40" úr vafranum til þjónsins sér TypeScript á þjóninum það ekki meðan appið keyrir. Þess vegna staðfesta vel smíðuð öpp líka inngögn, oft með staðfestingarsafni sem athugar lögunina og breytir þeim í réttan Booking.

TypeScript vs JavaScript

Hugtök útskýrð

Algengar villur og ranghugmyndir

• „TypeScript gerir kóðann villulausan.“ Það grípur ósamræmi í lögun gagna, ekki röng rökfræði. Staðgreiðsla upp á 2% í stað 20% stenst gerðaathugun.
• „Gerðir vernda mig fyrir röngum innslætti.“ Gerðir hverfa við keyrslu. Staðfestu gögn frá notendum, eyðublöðum og API-um.
• any alls staðar. Þegar gervigreindin festist getur hún gripið í any eða // @ts-ignore til að þagga niður í villum. Það felur vandamál í stað þess að laga þau.
• Að hunsa gerðavillur af því forskoðunin virkar. Sum verkfæri keyra kóða jafnvel með gerðavillum. Villurnar eru samt villur sem bíða þess að gerast.
• „TypeScript er hægara.“ Gerðirnar eru fjarlægðar áður en keyrt er; JavaScriptið sem keyrir er í raun það sama.
• „Það er bara fyrir stór teymi.“ Einleikjarar njóta líka góðs af því, sérstaklega þegar gervigreindin gerir flestar breytingarnar.

Hvað á að biðja AI-smiðinn um

• „Notaðu TypeScript með strangri stillingu (strict mode).“
• „Skilgreindu sameiginlegar gerðir fyrir helstu skrárnar okkar, Customer, Booking, Invoice, og notaðu þær bæði í framenda og bakenda.“
• „Ekki nota any eða @ts-ignore til að komast framhjá villum. Lagaðu undirliggjandi vandamálið og segðu mér hvað það var.“
• „Staðfestu öll innkomin gögn á þjóninum, ekki bara með gerðum.“
• „Keyrðu gerðaathugunina og lagaðu allar villur áður en þú segir mér að verkinu sé lokið.“
• „Þegar þú endurnefnir reit skaltu uppfæra alla staði sem TypeScript merkir.“
• „Útskýrðu þessa gerðavillu á venjulegu máli.“

Til að fara yfir það sem gervigreindin framleiddi, sjá hvernig þú yfirfarar kóða frá gervigreind og hvernig þú villuleitar app smíðað með gervigreind.

TypeScript í Mythex

Þegar þú biður ekki um neitt sérstakt byrjar Mythex nýtt verkefni á Vite + React + TypeScript + Tailwind. Kóðaritillinn inniheldur tungumálagreind (language intelligence): útfyllingar, greiningar og „fara að skilgreiningu“ fyrir TypeScript og JavaScript, auk annarra tungumála, svo gerðavillur sjást í kóðanum sjálfum en ekki bara í forskoðuninni. Ritillinn er lesaðgengilegur á Free og fullkomlega breytanlegur á Pro. Þú getur samt beðið um aðra uppsetningu í fyrstu skipun þinni. Skjalasíðan um hvernig tæknin er valin útskýrir hvernig, og skjöl kóðaritilsins lýsa því sem ritillinn sýnir.

Spurningar