Programmēšana

TypeScript vai JavaScript: izprotiet atšķirības

Pasaules tīmeklis pamatā darbojas ar JavaScript, HTML un CSS. Diemžēl JavaScript trūkst vairākas funkcijas, kas palīdzētu izstrādātājiem to izmantot liela mēroga lietojumprogrammām. Ievadiet TypeScript.

Kas ir JavaScript?

JavaScript sākās kā skriptu valoda Netscape Navigator tīmekļa pārlūkprogrammai; Brendans Eihs 1995. gadā uzrakstīja prototipu 10 dienu laikā. Nosaukums JavaScript ir pamudinājums uz Sun Microsystem Java valodu, lai gan abas valodas ir diezgan atšķirīgas, un vārdu līdzība gadu gaitā ir radījusi ievērojamu neskaidrību. JavaScript, kas ir ievērojami attīstījies, tagad tiek atbalstīts visās mūsdienu tīmekļa pārlūkprogrammās.

Klienta puses JavaScript ieviešanai Netscape Navigator ātri sekoja servera puses JavaScript ieviešana tīmekļa serveros Netscape Enterprise Server un Microsoft IIS. Pēc aptuveni 13 gadiem Raiens Dāls ieviesa Node.js kā atvērtā koda, starpplatformu, JavaScript izpildlaika vidi, kas nav atkarīga no jebkura pārlūka vai tīmekļa servera.

JavaScript valoda

JavaScript ir daudzparadigmu valoda. Tam ir cirtaini iekavu sintakse un semikoli, tāpat kā C valodu saime. Tam ir vāja, dinamiska rakstīšana, un to vai nu interpretē, vai (biežāk) apkopo tieši laikā. Kopumā JavaScript ir ar vienu pavedienu, lai gan ir Web Workers API, kas veic daudzsavienojumu, un ir notikumi, asinhrono funkciju izsaukumi un atzvanīšana.

JavaScript atbalsta objektorientētu programmēšanu, izmantojot prototipus, nevis klases mantojumu, kas tiek izmantots C ++, Java un C #, lai gan klasē sintakse JavaScript ES6 tika pievienota 2015. gadā. JavaScript atbalsta arī funkcionālu programmēšanu, tostarp slēgšanu, rekursiju un lambdas (anonīmas funkcijas).

Pirms JavaScript ES6 valodai nebija astes zvana optimizācijas; tagad tas notiek, lai gan jums ir jāieslēdz stingrs režīms ("izmantot stingri"), lai to iespējotu, un ieviešana katrā pārlūkprogrammā ir atšķirīga. Stingrs režīms maina arī JavaScript semantiku un dažas parasti klusas kļūdas, lai mestos kļūdas.

Kas notiek ar apzīmējumu “ES6”? Standartizētās JavaScript valodas nosaukums ir ECMAScript (ES) pēc ECMA Starptautiskās standartu organizācijas; ES6 sauc arī par ECMAScript 2015 (ES2015). ES2020 pašlaik ir standarta projekts.

Kā vienkāršu piemēru, lai sniegtu jums JavaScript valodas garšu, šeit ir daži kodi, lai izlemtu, vai tā ir diena vai vakars, un dinamiski ievietojiet atbilstošo sveicienu nosauktajā tīmekļa elementā, kas atrodas pārlūkprogrammas dokumentu objektā:

var stunda = jauns datums (). getHours ();

var apsveikums;

ja (stunda <18) {

sveiciens = "Laba diena";

} cits

sveiciens = "Labvakar";

}

document.getElementById ("demo"). internalHTML = sveiciens;

JavaScript ekosistēma

Ir daudz JavaScript API. Dažus no tiem nodrošina pārlūks, piemēram, dokumentu API iepriekš parādītajā kodā, un dažus piegādā trešās puses. Daži API attiecas uz klienta puses lietošanu, citi uz servera puses lietošanu, citi uz darbvirsmas lietošanu un citi uz vairāk nekā vienu vidi.

Pārlūka API ietver dokumenta objekta modeli (DOM) un pārlūkprogrammas objekta modeli (BOM), ģeogrāfisko atrašanās vietu, kanvu (grafika), WebGL (grafiskā procesora paātrinātu grafiku), HTMLMediaElement (audio un video) un WebRTC (reāllaika komunikāciju).

Trešo pušu API ir daudz. Daži no tiem ir saskarnes pilnām lietojumprogrammām, piemēram, Google Maps. Citi ir utilītas, kas atvieglo JavaScript HTML5 un CSS programmēšanu, piemēram, jQuery. Daži, piemēram, Express, ir lietojumprogrammu ietvari īpašiem mērķiem; programmas Express mērķis ir izveidot tīmekļa un mobilo lietojumprogrammu serverus vietnē Node.js. Express virsū ir uzbūvēta virkne citu sistēmu. 2016. gadā es apspriedu 22 JavaScript ietvarus, cenšoties saprast, kas kļūst par zooloģisko dārzu; daudzas no šīm sistēmām joprojām pastāv vienā vai otrā formā, bet vairākas ir gājušas malā.

Tur ir daudzi vairāk JavaScript moduļu, vairāk nekā 300 000. Lai tiktu galā ar to, mēs izmantojam paku pārvaldnieki, piemēram, npm, noklusējuma pakotņu pārvaldnieks Node.js.

Viena alternatīva npm ir Dzija, kas nāk no Facebook, un apgalvo deterministisko instalēšanas priekšrocības. Līdzīgi rīki ietver Bower (no Twitter), kas pārvalda priekšējās daļas komponentus, nevis Node moduļus; Endera, kas sevi dēvē par npm mazo māsu; un jspm, kas izmanto ES moduļus (jaunāko ECMA moduļu standartu), nevis CommonJS moduļus, vecāku de facto standartu, ko atbalsta npm.

Webpack apvieno JavaScript moduļus statiskos pārlūka īpašumos. Pārlūka apstiprināšana ļauj izstrādātājiem rakstīt Node.js stila moduļus, kas apkopo lietošanai pārlūkprogrammā. Grunt ir uz failiem orientēts JavaScript uzdevumu skrējējs, un gulp ir straumēšanas veidošanas sistēma un JavaScript uzdevumu skrējējs. Izvēle starp ņurdēšanu un gulēšanu nav izšķiroša. Esmu gan instalējis, gan lietojis to, kurš tika izveidots konkrētam projektam.

Lai padarītu JavaScript kodu uzticamāku kompilācijas neesamības gadījumā, mēs izmantojam šķiedras. Šis termins nāk no C valodas savārstījuma rīka, kas bija standarta Unix lietderība. JavaScript tekstilos ietilpst JSLint, JSHint un ESLint. Pēc koda izmaiņām varat automatizēt darbojošos atkritumus, izmantojot uzdevumu skrējēju vai savu IDE. Atkal, izvēle starp drēbēm nav skaidra, un es izmantoju to, kurš tika izveidots konkrētam projektam.

Runājot par redaktoriem un IDE, es esmu pārskatījis 6 JavaScript IDE un 10 JavaScript redaktorus, pēdējoreiz 2019. gadā. Manas galvenās izvēles bija Sublime Text (ļoti ātrs redaktors), Visual Studio kods (konfigurējams redaktors / IDE) un WebStorm (IDE).

Transpileri ļauj tulkot dažas citas valodas, piemēram, CoffeeScript vai TypeScript, uz JavaScript, un mūsdienu JavaScript (piemēram, ES2015 kodu) tulkot pamata JavaScript valodā, kas darbojas (gandrīz) jebkurā pārlūkprogrammā. (Visas derības ir izslēgtas attiecībā uz agrīnām Internet Explorer versijām.) Visizplatītākais mūsdienu JavaScript tulkotājs ir Bābels.

Kas ir TypeScript?

TypeScript ir tipizēts JavaScript kopums, kas tiek apkopots vienkāršā JavaScript valodā (ES3 vai jaunāks; to var konfigurēt). Atvērtā koda TypeScript komandrindas kompilatoru var instalēt kā paketi Node.js. TypeScript atbalsts tiek nodrošināts ar Visual Studio 2017 un Visual Studio 2019, Visual Studio kodu un WebStorm, un to var pievienot Sublime Text, Atom, Eclipse, Emacs un Vim. TypeScript kompilators / transpiler tsc ir rakstīts TypeScript.

TypeScript pievieno JavaScript izvēles veidus, klases un moduļus un atbalsta rīkus plaša mēroga JavaScript lietojumprogrammām jebkuram pārlūkam, jebkuram resursdatoram un jebkurai OS. Starp daudziem citiem TypeScript laimestiem, TypeScript ir atjaunots populārais Angular ietvars.

Veidi ļauj JavaScript izstrādātājiem, izstrādājot JavaScript lietojumprogrammas, izmantot ļoti produktīvus izstrādes rīkus un praksi, piemēram, statisko pārbaudi un koda atjaunošanu.

Veidi nav obligāti, un tipa secinājums ļauj dažām tipa piezīmēm būtiski mainīt koda statisko pārbaudi. Veidi ļauj definēt saskarnes starp programmatūras komponentiem un gūt ieskatu par esošo JavaScript bibliotēku darbību.

TypeScript piedāvā atbalstu jaunākajām un jaunākajām JavaScript funkcijām, ieskaitot ECMAScript 2015 un nākamos priekšlikumus, piemēram, asinhronizācijas funkcijas un dekoratorus, lai palīdzētu veidot stabilus komponentus.

TypeScript valoda

TypeScript valoda pieņem JavaScript kā derīgu, taču piedāvā papildu iespējas tipa anotācijām, tipa pārbaudei sastādīšanas laikā, klasēm un moduļiem. Tas viss ir ārkārtīgi noderīgs, ja mēģināt izveidot stabilu programmatūru. Vienkāršais JavaScript ģenerē kļūdas tikai izpildlaika laikā un tad tikai tad, ja jūsu programma nonāk pie ceļa ar kļūdām.

TypeScript in 5 minutes apmācība padara priekšrocības skaidras. Sākuma punkts ir tīrs JavaScript ar paplašinājumu .ts:

funkciju sveicējs (persona) {

atgriezties "Sveiki" + persona;

}

let user = "Jane User";

document.body.textContent = sveicējs (lietotājs);

Ja jūs to kompilējat ar tsc, tas radīs identisku failu ar paplašinājumu .js.

Apmācībā ir jāmaina šis kods pakāpeniski, pievienojot tipa anotāciju persona: virkne funkcijas definīcijā, sastādot, pārbaudot kompilatora tipa pārbaudi, pievienojot saskarni a persona tipa un visbeidzot pievienojot klasi Students. Galīgais kods ir:

klases skolnieks {

fullName: virkne;

konstruktors (public firstName: string, public middle Sākotnējais: string,

public lastName: string) {

this.fullName = firstName + "" + middleInitial + "" + lastName;

    }

}

saskarne Persona {

firstName: string;

uzvārds: virkne;

}

funkciju sveicējs (persona: Persona) {

atgriezt "Sveiki" + personai.vards + "" + personai.pavardis;

}

let user = new Student ("Džeina", "M.", "Lietotājs");

document.body.textContent = sveicējs (lietotājs);

Apkopojot to un apskatot emitēto JavaScript, jūs redzēsiet, ka klases TypeScript ir tikai tā paša prototipa mantojuma stenogrāfs, kas tiek izmantots vienkāršā JavaScript ES3. Ņemiet vērā, ka īpašības persona.vārds un persona.pavardis kompilators automātiski ģenerē, ieraugot tos publiski atribūti Students klases konstruktors, kā arī pārnests uz Persona interfeiss. Viena no jaukākajām tipa anotāciju priekšrocībām TypeScript ir tā, ka tās atpazīst rīki, piemēram, Visual Studio kods:

Ja rediģējot VS kodā, kodā ir kļūdas, cilnē Problēmas tiks parādīti kļūdu ziņojumi, piemēram, ja izdzēsīsit rindas beigas, parādot Students:

Apmācībā Migrēšana no JavaScript tiek detalizēti aprakstīts, kā jaunināt esošu JavaScript projektu. Izlaižot iestatīšanas darbības, metodes būtība ir pārdēvēt .js failus uz .ts pa vienam. (Ja failā tiek izmantots JSX, paplašinājums, ko izmanto React, jums tas jāpārdēvē par .tsx, nevis .ts.) Pēc tam pievelciet kļūdu pārbaudi un novērsiet kļūdas.

Cita starpā jums būs jāmaina, pamatojoties uz moduļiem pieprasīt () vai definēt () paziņojumus TypeScript importēšanas paziņojumos un pievienojiet deklarāciju failus visiem izmantotajiem bibliotēkas moduļiem. Jums arī jāpārraksta moduļu eksportēšana, izmantojot TypeScript eksports paziņojums, apgalvojums. TypeScript atbalsta CommonJS moduļus, piemēram, Node.js.

Ja rodas kļūdas par nepareizu argumentu skaitu, varat rakstīt TypeScript funkciju pārslodzes parakstus. Tā ir svarīga JavaScript trūkuma funkcija. Visbeidzot, jums vajadzētu pievienot veidus savām funkcijām un vajadzības gadījumā izmantot saskarnes vai klases.

Parasti jums nav jāraksta savi deklarācijas faili publiskā domēna JavaScript bibliotēkām. DefinitelyTyped ir deklarāciju failu krātuve, kuras visas ir pieejamas, izmantojot npm. Deklarācijas varat atrast, izmantojot TypeSearch lapu.

Kad visi jūsu JavaScript faili būs konvertēti uz TypeScript, uzlaboti veidi un novērstas kļūdas, jums būs daudz izturīgāka kodu bāze. Tā vietā, lai pastāvīgi labotu izpildītāja kļūdas, par kurām ziņojuši testētāji vai lietotāji, jūs varēsiet statiski atklāt visbiežāk sastopamās kļūdas.

Ir vērts skatīties, kā Anderss Hejlsbergs apspriež TypeScript. Kā jūs dzirdēsiet no viņa, TypeScript ir JavaScript, kas mērogo.

$config[zx-auto] not found$config[zx-overlay] not found