TypeScript срещу JavaScript: Каква е разликата?

Ако сте нов разработчик, може би сте чували за TypeScript, сравнително нов език за програмиране, който придоби популярност след пускането му през 2012 г. от Microsoft [1].

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

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

Така че, ако вече знаете JavaScript, изучаването на TypeScript ще ви дойде съвсем естествено.

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

Ние ще покрием:

• Какво е JavaScript?
• Какво е TypeScript?
• Предимства на TypeScript
• Недостатъци на TypeScript
• Сравнителна диаграма: TypeScript срещу JavaScript
• Трябва ли да науча TypeScript?
• Приключване и следващи стъпки

Какво е JavaScript?

JavaScript ES6 (известен също като ECMAScript 6) е клиентски, междуплатформен, базиран на прототип скриптов език, създаден от Brendan Eich.

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

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

JavaScript също работи директно в уеб браузъра, така че не са необходими допълнителни ресурси за изпълнение на JavaScript код. Въпреки това все още може да бъде непосилно да се отстраняват грешки в каскада от грешки наведнъж, вместо по пътя.

Забележка: Други примери за динамично въведени езици включват Python, PHP, Perl и Ruby.

От създаването си през 1995 г. „JavaScript премина през множество итерации“, за да подобри своята функционалност и да улесни разработката на софтуер. Сега дори може да се използва за създаване на интерактивни игри!

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

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

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

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

Забележка: Може да не мислите за JavaScript като за обектно-ориентиран език за програмиране, но той всъщност има страхотна поддръжка за ООП!

Какво е TypeScript?

TypeScript е език за програмиране с отворен код, но започна като вътрешен продукт на Microsoft през 2010 г. TypeScript беше направен публично достъпен в GitHub [2] в края на 2012 г.

Тъй като TypeScript се счита за строго надмножество на ECMAScript 2015, „всяка JavaScript програма“ също може да се счита за TypeScript програма.

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

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

Забележка: Статично въведените езици включват Java, C и C++. При статичното типизиране програмистът трябва да посочи типа данни на всяка декларирана променлива.

TypeScript е изграден върху 11 дизайнерски цели:

Microsoft идентифицира 11 ключови цели, които ще стимулират еволюцията на TypeScript.

1. Статично идентифициране на потенциални грешки
2. Осигурете начин за структуриране на по-големи части от код
3. Избягвайте да увеличавате времето за изпълнение на програмата
4. Компилирайте до чист, разпознаваем JavaScript
5. Създайте език, който е съставим и лесен за разсъждение
6. Останете напълно съвместими с настоящите и бъдещите версии на JavaScript
7. Запазване на поведението по време на изпълнение на целия JavaScript код
8. Избягвайте добавянето на синтаксис на ниво израз
9. Направете TypeScript последователен и напълно изтриваем
10. Бъдете инструмент за разработка на различни платформи
11. Езиковите промени не трябва да нарушават миналите версии на TypeScript

Предимства на TypeScript

TypeScript осигурява две силни предимства пред JavaScript:

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

Забележка: polyfill е кодов фрагмент (обикновено написан на JavaScript), който се опитва да имитира методите на по-нова функция. Полифилирането позволява на по-старите браузъри да поддържат нови функции, които обикновено не се поддържат.

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

Компилаторът на TypeScript също е много конфигурируем. Има много „опции“ за регулиране на различни аспекти на проверката на типа и компилирането. Колкото по-строги са проверките, толкова повече грешки могат да бъдат уловени от компилатора на TypeScript.

Най-честата грешка на TypeScript е свързана с присвояването на типове. Основната цел на инструмента за проверка на типове е да гарантира, че стойностите са предоставени с правилните типове.

Допълнителни функции

• Съвместимост: TypeScript поддържа практически всички рамки и библиотеки на JavaScript, включително:
• React: Приложение с една страница (SPA), което използва виртуален DOM за подобряване на паметта и производителността
• Vue: Написано на TypeScript, лесно за постепенно интегриране в приложения
• Angular: Чудесно за бързо създаване на прототипи, лесно тестване и оптимизиране на производителността на сървъра
• Синтактична захар: Налагането на строги типове прави кода по-лесен за четене, защото не е нужно да мислите какъв тип е дадена променлива
• Разширена поддръжка на IDE:
• Код на Visual Studio
• Затъмнение
• атом
• WebStorm
• …и още!

Недостатъци на TypeScript

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

Ето няколко недостатъка, които трябва да имате предвид:

• Време за компилиране: Програмите на TypeScript имат по-висока скорост на изпълнение в сравнение с тези, написани на JavaScript
• Крива на обучение: TypeScript е малко по-сложен от JavaScript и ще изисква време, за да свикнете
• Несъответствия на типове: Тъй като кодът на TypeScript се транспилира в JavaScript по време на изпълнение, може да получите необичайни грешки и несъответстващи типове
• По-малко гъвкавост: Променливите и параметрите са по-малко гъвкави в TypeScript

Сравнителна диаграма: TypeScript срещу JavaScript

Трябва ли да науча TypeScript?

Ако не сте нови в уеб разработката и планирате да работите върху по-малки проекти, тогава JavaScript е идеалното място да започнете.

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

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

Ако се интересувате повече от способността да четете кода, който пишете, отколкото от това колко време отнема компилирането, тогава TypeScript ще има очевидно предимство.

Забележка: Едно нещо, което трябва да имате предвид е, че „разработчиците на TypeScript“ обикновено получават средно по-високо възнаграждение, тъй като те са по-малко от разработчиците на JavaScript. Независимо от това, никога не боли да имате още едно перо в шапката си!

Инсталация

Чрез npm пакет

Първо се уверете, че имате IDE, Node.js Package Manager (npm) и компилатора TypeScript. Node.js предоставя среда, в която вашият TypeScript пакет може да работи.

След това отворете командния ред или терминал и въведете следното:

npm install -g typescript

Ако е инсталиран правилно, трябва да можете да проверите коя версия имате с tsc -v.

Сега можете да използвате следната команда, за да инсталирате TypeScript във вашия локален проект като зависимост.

npm install typescript --save-dev

Чрез Microsoft Visual Studio Code

Първо се уверете, че имате инсталирано Visual Studio, заедно с натоварването за уеб разработка на ASP.NET.

Следващ:

1. Отворете нов проект в Visual Studio
2. Щракнете с десния бутон на вашия възел на проекта в Solution Explorer
3. Щракнете върху Управление на пакети NuGet
4. В раздела Преглед потърсете Microsoft.TypeScript.MSBuild
5. Кликнете върху Инсталиране

В случай, че проектът ви не поддържа NuGet, можете също да инсталирате разширението TypeScript във Visual Studio, като отидете на Разширения › Управление на разширения.

Приключване и следващи стъпки

Страхотен! Прегледахме някои от основните характеристики на TypeScript, както и някои от компромисите. Надяваме се, че това кратко въведение в TypeScript беше информативно и ви накара да мислите за следващия си проект. Кой знае? Може да искате да го напишете на TypeScript.

Ако обмисляте да станете разработчик на TypeScript, имаме много страхотни ресурси, за да продължите да разширявате познанията си, така че отидете да ги проверите!

За да ви помогне да овладеете TypeScript, Educative създаде TypeScript за програмисти учебната пътека.

Приятно учене!

Продължете да учите за Typescript в Educative

• Урок за TypeScript: ръководство стъпка по стъпка за изучаване на TypeScript
• „Разбиране на разширените концепции в TypeScript“
• Просто ръководство за TypeScript интерфейси: декларация и случаи на използване

Започнете дискусия

Предпочитате ли TypeScript или JavaScript? Беше ли полезна тази статия? Кажете ни в коментарите по-долу!