Kas yra TypeScript? Pradedančiųjų vadovas po JavaScript supersetą
TypeScript turi keletą pagrindinių funkcijų, kurios iš esmės pagerina žiniatinklio programų kūrimą. Šiame TypeScript vadove pateikiama įvadas į programavimo kalbą ir paaiškinamos kai kurios svarbiausios jos funkcijos bei naudojimo būdai, taip pat privalumai ir trūkumai.
Kas yra TypeScript?
TypeScript buvo sukurtas „Microsoft“ ir pagrįstas programavimo kalba JavaScript, kuri plačiai naudojama žiniatinklio kūrimui. Viena iš išskirtinių TypeScript savybių yra statinis tipizavimas. Skirtingai nuo JavaScript, kuri turi dinaminį tipizavimą, TypeScript leidžia deklaruoti duomenų tipus kintamiesiems, funkcijoms ir parametrams. Tai leidžia anksti aptikti kodavimo klaidas, todėl klaidas galima nustatyti dar prieš vykdant kodą. Statinis tipizavimas ne tik žymiai pagerina kodo kokybę, bet ir padidina kodo skaitomumą.
TypeScript sintaksė yra beveik identiška JavaScript sintaksei, todėl ją daug lengviau integruoti į esamus JavaScript projektus. Iš tiesų, TypeScript yra JavaScript superset, o tai reiškia, kad bet koks teisingas JavaScript kodas yra taip pat galiojantis TypeScript kodas. Tai leidžia jums palaipsniui pereiti prie TypeScript ir pasinaudoti statinio tipizavimo bei kitų funkcijų privalumais, nereikalaudami visiškai perrašyti esamos kodų bazės.
Čia pateikiamas paprastas JavaScript pavyzdys:
function greet(name) {
return "Hello, " + name;
}
console.log(greet(123)); // Output: "Hello, 123"Pirmiau pateiktame kode funkcija greet nėra apribota konkrečiu duomenų tipu parametrui name. Tai reiškia, kad funkcija vis tiek veiks, net jei kaip argumentą perduosime skaičių.
TypeScript kalboje kodas gali atrodyti taip:
function greet(name: string): string {
return "Hello, " + name;
}
console.log(greet(123)); // Error in TypeScriptČia mes deklaravome parametrą name kaip eilutę. Jei bandysime naudoti funkciją su skaičiumi, TypeScript parodys klaidą, nes perduotas duomenų tipas neatitinka laukiamo duomenų tipo.
Šis pavyzdys rodo, kaip „TypeScript“ padeda anksti aptikti klaidas, pagerindamas kodo kokybę ir užkertant kelią neteisingam duomenų tipų naudojimui. Svarbu pažymėti, kad „TypeScript“ galiausiai kompiliuojamas į „JavaScript“, todėl jį galima vykdyti bet kurioje „JavaScript“ aplinkoje. Tačiau tai reiškia, kad tipų saugumo privalumais galite naudotis tik kūrimo etape.
Kam naudojamas TypeScript?
TypeScript yra būtinas įvairiose programinės įrangos kūrimo srityse, ypač tais atvejais, kai tipo saugumas ir kodo kokybė yra ypač svarbūs.
Vienas iš žinomiausių TypeScript naudojimo pavyzdžių yra žiniatinklio kūrimas. Šiuo atveju TypeScript užtikrina, kad JavaScript kodas būtų rašomas taip, kad būtų saugesnis ir lengviau prižiūrimas. Tai naudinga dideliuose frontend projektuose su sudėtingomis kodų bazėmis. Tačiau TypeScript taip pat gali būti įdiegtas serverio pusėje (backend) Node.js programose, kad užtikrintų papildomą saugumo lygį. Serverių neturinčiose architektūrose, tokiose kaip AWS Lambda ir Azure Functions, TypeScript padeda sumažinti klaidų skaičių ir užtikrina patikimą vykdymą.
Kryžminė platforma yra dar viena sritis, kurioje TypeScript demonstruoja savo privalumus. Ji gali žymiai optimizuoti kryžminių platformų programas ir mobiliųjų programų kūrimą. Tokios platformos kaip NativeScript ir React Native palaiko TypeScript, kai reikia programuoti mobiliąsias programas skirtingoms platformoms. Žaidimų kūrimo srityje TypeScript naudojamas projektuose, kuriuose naudojamas WebGL arba žaidimų varikliai, tokie kaip Phaser arba Babylon.js. TypeScript tipo saugumas padeda pagerinti žaidimų kokybę ir priežiūrą.
TypeScript taip pat naudojamas duomenų vizualizavimo ir analizės projektuose. Tokios bibliotekos kaip D3.js palaiko TypeScript ir leidžia kurti sudėtingas informacines lenteles ir vizualizacijas.
Kaip įdiegti TypeScript
TypeScript įdiegimas yra paprastas ir užtrunka tik keletą žingsnių. Jei jūsų kompiuteryje yra Node.js, galite įdiegti TypeScript naudodami npm (Node Package Manager).
1 žingsnis: Atsisiųskite Node.js
Patikrinkite, ar jūsų kompiuteryje įdiegta Node.js. Jei dar neįdiegėte Node.js, galite ją atsisiųsti ir įdiegti iš oficialios svetainės.
2 žingsnis: įdiekite „TypeScript“ terminale
Atidarykite komandų eilutę (pvz., „Command Prompt“ Windows sistemoje arba terminalą macOS arba Linux sistemoje) ir įveskite šią komandą, kad įdiegtumėte „TypeScript“ visoje sistemoje:
npm install -g typescript-g (globalus) žymeklis įdiegia TypeScript visoje jūsų sistemoje, kad galėtumėte jį naudoti iš bet kur.
3 žingsnis: Patikrinkite įdiegtą versiją
Galite patikrinti, ar įdiegimas buvo sėkmingas, vykdydami šią komandą:
tsc -vŠi komanda rodo, kokia TypeScript versija yra įdiegta. Jei rodomas versijos numeris, tai reiškia, kad įdiegimas buvo sėkmingas.
Įdiegus programą, galite kurti JavaScript failus, sukuriant TypeScript failus (su plėtiniu .ts) ir kompiliuojant juos su TypeScript kompiliatoriumi tsc.
4 žingsnis: Sukurkite TypeScript failą
Sukurkite TypeScript failą, pvz., app.ts, ir įterpkite savo TypeScript kodą.
type Person = { name: string, age: number };
const alice: Person = { name: "Alice", age: 30 };
console.log(`Hello, I am ${alice.name} and I am ${alice.age} years old.`);5 žingsnis: Kompiliuokite failą
Sudarykite TypeScript failą įvedę šią komandą:
tsc app.tsTai sukompiliuos app.ts į JavaScript failą su pavadinimu app.js. Tada galėsite vykdyti JavaScript failą.
Kokias funkcijas turi TypeScript?
Pastaraisiais metais žymiai pažengė interneto svetainių kūrimas, o „TypeScript“ tapo itin efektyvia „JavaScript“ alternatyva. Toliau apibendrinome svarbiausias šio programavimo kalbos savybes.
Statinis tipizavimas
Statinis tipizavimas yra esminė TypeScript funkcija, leidžianti nurodyti kintamųjų, parametrų, funkcijų ir kitų elementų duomenų tipus kodo viduje. Skirtingai nei dinaminis tipizavimas JavaScript, kur duomenų tipai nustatomi vykdymo metu, TypeScript duomenų tipai priskiriami kūrimo metu, prieš vykdant kodą. Šis metodas padeda anksti nustatyti klaidas ir logines problemas.
function add(a: number, b: number): number {
return a + b;
}
const result = add(5, 3); // valid
const result = add(5, "3"); // Type ErrorŠiame pavyzdyje naudojome statinį tipizavimą funkcijai add. Du parametrai a ir b yra deklaruojami kaip skaičiai (number), o funkcija grąžina number tipo vertę. Bet koks bandymas naudoti šią funkciją su kitokio tipo duomenimis privers TypeScript ją identifikuoti kaip klaidą.
Pasirenkamas rašymas
Naudodami pasirinktinį tipizavimą, galite nurodyti tam tikrų kintamųjų ir parametrų duomenų tipus, o kitiems palikti nenustatytą duomenų tipą.
function sayHello(name: string, age: any): string {
if (age) {
return `Hello, ${name}, you are ${age} years old.`;
} else {
return `Hello, ${name}.`;
}
}sayHello funkcija apibrėžiama parametrais name ir age. Žymėjimas any rodo, kad age parametras gali būti bet kokio duomenų tipo.
ES6+ funkcijos
TypeScript palaiko modernias JavaScript funkcijas, įskaitant ES6 ir naujesnes funkcijas, pvz., rodyklių funkcijas ir šablonų eilutes.
const multiply = (a: number, b: number): number => a * b;
const greeting = (name: string) => `Hello, ${name}!`;Rodyklės funkcijos leidžia naudoti trumpesnę ir glaudesnę sintaksę.
Kodų organizavimas
TypeScript užtikrina geresnį kodo organizavimą ir garantuoja, kad kodas bus suskirstytas į pakartotinai naudojamas dalis. Tai įmanoma dėl modulių ir vardų erdvių.
// Math.ts
export function add(a: number, b: number): number {
return a + b;
}
// Main.ts
import { add } from './Math';
const result = add(5, 3);Čia parodysime, kaip struktūrizuoti kodą naudojant modulius ir kaip organizuoti import ir export. Funkcija „add“ apibrėžiama atskirame modulyje, pavadintame Math.ts, o tada importuojama ir integruojama į kitą modulį, pavadintą Main.ts.
Objektinis programavimas (OOP)
TypeScript palengvina objektų orientuotą programavimą naudojant TypeScript klases, sąsajas ir paveldėjimą:
class Person {
constructor(public name: string, public age: number) {}
greet() {
console.log(`Hello, my name is ${this.name} and I'm ${this.age} years old.`);
}
}
const person = new Person("Alice", 30);
person.greet();Šis pavyzdys rodo klasių ir objektinio programavimo (OOP) naudojimą TypeScript. Klasė Person turi savybes name, age ir metodą greet, kuris naudojamas asmeniui pristatyti ir pateikti informaciją apie jį.
Išplėsta tipų sistema
TypeScript tipų sistema yra lanksti ir išsami. Galite kurti vartotojo apibrėžtus tipus ir sąsajas, netgi išplėsti esamus tipus.
interface Animal {
name: string;
}
interface Dog extends Animal {
breed: string;
}
const myDog: Dog = { name: "Buddy", breed: "Labrador" };Sąsaja Animal apibrėžia savybę name, o sąsaja Dog paveldi iš Animal ir prideda papildomą savybę breed. Objektas myDog turi abiejų sąsajų charakteristikas.
Suderinamumas su JavaScript
TypeScript yra suderinamas su JavaScript, todėl jį galima vykdyti bet kurioje JavaScript aplinkoje. Šis suderinamumas palengvina TypeScript integravimą į esamus JavaScript projektus.
// JavaScript-Code
function greet(name) {
return "Hello, " + name;
}
// TypeScript-Code
function greet(name: string): string {
return "Hello, " + name;
}Pateiktas JavaScript kodas (be tipizavimo) gali būti be jokių problemų naudojamas TypeScript kode (su tipizavimu).
Kokie yra TypeScript privalumai ir trūkumai?
Nors TypeScript turi daug privalumų, jis taip pat turi keletą trūkumų. Štai jų apžvalga:
Privalumai
TypeScript turi išsamią tipų apibrėžimų ekosistemą, skirtą daugeliui JavaScript bibliotekų ir sistemų. Tai leidžia sklandžiai ir paprastai integruoti trečiųjų šalių kodą į TypeScript projektus. Tai yra naudinga šiandieniniame internetinių programų pasaulyje, kuris dažnai remiasi keliomis bibliotekomis ir sistemomis.
Be statinio tipizavimo, TypeScript siūlo daugybę kūrimo funkcijų, įskaitant sąsajas, klases, modulius ir dabartinių ECMAScript standartų palaikymą. Šios funkcijos pagerina kodo struktūrą, palengvina projektų priežiūrą ir mastelį bei skatina produktyvumą kūrimo procese. Daugelis integruotų kūrimo aplinkų (IDE), pvz., Visual Studio Code, puikiai palaiko TypeScript.
Trūkumai
TypeScript reikalauja laiko priprasti, ypač tiems programuotojams, kurie prieš tai dirbo tik su JavaScript. TypeScript kodas turi būti kompiliuojamas JavaScript, prieš jį galima vykdyti naršyklėse ar Node.js aplinkose. Tai sukuria papildomą žingsnį kūrimo procese.
Mažesniuose projektuose „TypeScript“ gali būti laikomas pernelyg sudėtingu, nes tipo saugumo privalumai gali būti ne tokie akivaizdūs. „TypeScript“ projektai gali reikalauti daugiau išteklių dėl papildomos tipo informacijos ir kompiliavimo etapų.
Kokios yra TypeScript alternatyvos?
Yra įvairių žiniatinklio programavimo kalbų, kurios gali būti gera alternatyva TypeScript, priklausomai nuo konkrečių projekto reikalavimų ir kūrėjo (-ų) pageidavimų.
- Flow: Flow yra statinis JavaScript tipo tikrintuvas, sukurtas „Facebook“. Jis leidžia pridėti tipus prie JavaScript kodo be būtinybės visiškai pereiti prie TypeScript. Flow yra geras pasirinkimas, jei norite palaipsniui integruoti tipavimą į savo JavaScript projektus.
- Dart: tai „Google“ sukurta programavimo kalba, kuri gali būti naudojama kuriant žiniatinklio ir mobiliąsias programas. Ji užtikrina tipų saugumą ir gerą našumą. Dart dažnai naudojama kartu su Flutter mobiliųjų programų kūrimo platforma.
- PureScript: PureScript yra griežtai tipizuota funkcinė programavimo kalba, kuri užtikrina stiprų tipų saugumą ir grynai funkcinį programavimo stilių. Ji leidžia importuoti JavaScript bibliotekas.
- Elm: Elm yra funkcinė, griežtai tipizuota kalba, sukurta žiniatinklio programų kūrimui. Elm skatina Elm architektūros principą ir užtikrina aukštą tipo saugumą.
- ReasonML (BuckleScript): ši kalba buvo sukurta „Facebook“ ir yra pagrįsta OCaml. BuckleScript yra kompiliatorius, kuris kompiliuoja ReasonML į JavaScript. Ji taip pat užtikrina tipų saugumą ir yra lengvai integruojama su React frontend kūrimo tikslais.
Kituose mūsų skaitmeninio vadovo straipsniuose gilinamės į kitas temas, pvz., TypeScript funkcijas ir TypeScript masyvus.
22f89da06ee6c19a3c6f99d1b532befa