Как да пренесете вашата JavaScript програма към TypeScript

Първоначално пуснат през 1995 г. след изумително кратък период на разработка, JavaScript оттогава се превърна в неразделна част от много сайтове и приложения. Днес JavaScript е намерил дом както в клиентските, така и в сървърните приложения. Разработчиците все още изискват много функции, въпреки всички промени, претърпени през годините.

TypeScript е скриптов език, който разширява JavaScript с много от тези дългоочаквани функции. Анотацията на типа, персонализираното въвеждане и интерфейсите са всички основни компоненти, заедно с по-добри инструменти за увеличаване на производителността.

Защо да си правите труда да превключвате?

Перспективата за смяна на езици при големи проекти може да бъде стресираща. За щастие на всеки, който обмисля задачата, процесът на пренасяне на проект от JavaScript към TypeScript е доста прост.

JavaScript прекара последните няколко години в набиране на популярност като основен език за програмиране. Първоначално използван само за скриптове в предния край на уебсайтове, пускането на Node.js донесе JavaScript страна на сървъра, спомагайки за разширяване на неговата популярност.

Въпреки че JavaScript стана много по-популярен напоследък, има много функции, които все още липсват в последната му реализация, ES6. За много разработчици тези липсващи функции ограничават полезността на JavaScript като език.

TypeScript има за цел да коригира тези опасения, като обвива JavaScript с допълнителни функции, след което транспилира потребителския код. Резултатът е безопасен за тип език с лекотата и използваемостта на JavaScript.

Вече има няколко инструмента и рамки с пълна поддръжка на TypeScript. Angular го използва от дълго време и дори React има начини да имплементира TypeScript.

TypeScript е като JavaScript Enhanced

TypeScript прилага много от функциите, които разработчиците често изискват в JavaScript. TypeScript е кръстен на пълната система от типове, която внедрява, включително функции като проверка на типа, безопасност и имплицитно въвеждане. TypeScript дори ви позволява дефинирайте и използвайте персонализирани пространства от имена.

TypeScript също така съдържа интерфейси, изброявания и извеждане на типа. TypeScript поддържа поддръжка за функции от най-новата реализация на JavaScript заедно с наследени функции и добавя набор от нови функции.

Като цяло фокусът на TypeScript е върху създаването на по-безопасен процес на разработка с по-мощни инструменти за подпомагане на програмистите.

Насърчава безопасен код

TypeScript използва вградена система за проверка на типа, за да валидира типовете променливи. Той включва набор от стандартни типове с опция за дефиниране на ваши собствени класове и типове. Типовете могат да бъдат изрично декларирани или изведени въз основа на присвояване.

TypeScript има няколко стандартни типа данни, включително низове, числа, булеви стойности и кортежи. Има и типове променливи, като unknown и any, които ви позволяват да използвате слабо въведен код.

Изводът за тип на TypeScript ви позволява да изпълнявате проверки на тип дори на стандартен JavaScript код, като го изпълнявате през транспилера на TypeScript.

Транспилацията го прави лесен за използване

От гледна точка на разработчиците, една от най-добрите характеристики на TypeScript е, че извежда ванилен JavaScript. Можете да стартирате TypeScript код чрез процес, известен като транспилация, който е подобен на компилация.

Вместо изпълним файл, резултатът от транспилацията е скрипт на език, различен от оригиналния на кода.

Кодът на TypeScript се транспилира в JavaScript, който след това можете да стартирате на сървър или клиент. Това ви позволява бързо и лесно да пишете код, който можете да изпълнявате на почти всяка платформа.

TypeScript подпомага продуктивността на разработчиците

Добавянето на типове към JavaScript не само позволява на кода да работи безопасно, но също така предоставя на разработчиците инструменти, които улесняват кодирането. Повечето съвременни IDE предлагат поддръжка на TypeScript, която позволява на инструменти за завършване на код като IntelliSense да предложат допълнителен контекст към кода. Може също така да предложи проверка на типа, докато пишете, като ви помага да улавяте грешки по-бързо.

Освен това допълнителните структури от данни и синтаксис на TypeScript са предназначени да увеличат четливостта на кода. Тези функции правят по-бързо и по-лесно създаването на висококачествен код и откриването на потенциални проблеми, преди да станат проблематични.

Как можете да пренесете своя код?

Ако започвате чисто нов проект, създаване на нов TypeScript проект е съвсем проста. Преобразуването на вече съществуващ проект към TypeScript обаче е малко по-ангажирано.

При повечето нормални обстоятелства перспективата за преобразуване на проект от един език на друг е плашеща. Преобразуването от JavaScript в TypeScript обаче е изненадващо просто.

TypeScript като надмножество на JavaScript

TypeScript се счита за надмножество на JavaScript. Това означава, че TypeScript добавя допълнителни слоеве от синтаксис и функционалност, без да променя или премахва основната функционалност, около която изгражда.

За разработчиците това означава, че всеки код, който работи правилно в JavaScript, автоматично ще се изпълнява правилно в TypeScript. Независимо дали въпросният скрипт е уеб сървър, написан да работи в NodeJS, или набор от предни скриптове за уеб страница, превключването е изключително лесно.

След като инсталирате транспилатора на TypeScript, можете да създадете прост tsconfig.json файл със следното съдържание:

{
"опции на компилатора": {
"outDir": "./build",
"allowJs": вярно,
"мишена": "es5"
 },
"включва": ["./src/**/*"]
}

Преместете всички приложими файлове в директорията src и стартирайте транспилера. Това ще създаде получените JavaScript файлове в изграждане указател.

Тези бързи и лесни промени ще конвертират стандартен JavaScript проект в TypeScript. От тук можете свободно да използвате новите функции, които TypeScript предлага в свободното си време. Можете да анотирате типове на променливи, да прилагате потребителски типове и да дефинирате интерфейси.

След всяка транспилация можете да използвате изхода от изграждане директория, ако е необходимо, като добавите файловете във всеки проект, както обикновено. Транспилерът ще въведе проверка на стандартния JavaScript и ще преобразува новите функции във валидни ES5 скриптове.

Какво трябва да знаете, за да преминете от JS към TS

Процесът на конвертиране на проект от JavaScript в TypeScript е изключително лесен. Преобразуването е толкова просто, колкото изключване на структурата на директорията, добавяне на конфигурационен файл и инсталиране на транспилера.

Извличането на всички предимства от новия език обаче може да бъде много по-дълъг проект. Въпреки че TypeScript може да изведе типа на всяка променлива в проект, те трябва да бъдат изрично декларирани. Връщането назад и добавянето на потребителски типове към проект, добавянето на подходящи анотации и създаването на интерфейси може да отнеме много време.

Добавянето на тези функции към проект обаче ще ви позволи да извлечете ползите, които идват с правилната проверка на типа и разширените инструменти. Големите проекти ще бъдат по-бързи и лесни за изграждане, вие ще идентифицирате грешките по-рано и новите разработчици ще имат по-лесно време да четат вашия код.