Какво е TypeScript? Силно написан JavaScript

Какво е TypeScript? Дефиниран TypeScript

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

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

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

TypeScript срещу JavaScript 

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

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

Въпреки това няма функционалност, която можете да кодирате в TypeScript, която да не можете да кодирате и в JavaScript. Това е така, защото TypeScript не се компилира в конвенционален смисъл - начинът, по който например C ++ се компилира в двоичен изпълним файл, който може да работи на определен хардуер. Вместо това компилаторът TypeScript прекодира TypeScript кода във функционално еквивалентен JavaScript. Тази статия от Шон Максуел на GitConnected има няколко чудесни примера за обектно-ориентирани кодови фрагменти на TypeScript и техните еквиваленти в JavaScript. Полученият JavaScript може след това да се изпълнява навсякъде, където може да се изпълнява всеки код на JavaScript, от уеб браузър до сървър, оборудван с Node.js.

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

За какво се използва TypeScript?

TypeScript е пуснат като отворен код през 2012 г., след като е разработен в рамките на Microsoft. (Софтуерният гигант остава управител и основен разработчик на проекта.) Тази статия на ZDNet от онова време предлага интригуващ поглед защо това се е случило: „Оказва се, че една от големите мотивации е опитът на други екипи в Microsoft, които се опитват да разработят и поддържайте продуктите на Microsoft в JavaScript. "

По това време Microsoft се опитва да разшири Bing Maps като конкурент на Google Maps, както и да предложи уеб версии на своя пакет Office - а JavaScript беше основният език за разработка на задачите. Но по същество разработчиците се затрудняват да пишат приложения в мащаба на водещите предложения на Microsoft, използвайки JavaScript. Затова те разработиха TypeScript, за да улеснят изграждането на приложения на ниво предприятие, които да работят в JavaScript среди. Това е духът на слогана за езика на официалния сайт на проекта TypeScript: „JavaScript, който се мащабира.“

Защо TypeScript е по-добър за този вид работа от ванилия JavaScript? Е, можем да спорим завинаги за достойнствата на обектно-ориентираното програмиране, но реалността е, че много разработчици на софтуер, които работят по големи корпоративни проекти, са свикнали с това и това помага при повторното използване на кода като балон по размер. Също така не трябва да пренебрегвате степента, до която инструментариумът може да повиши производителността на разработчиците. Както беше отбелязано, повечето корпоративни IDE поддържат фонова инкрементална компилация, която може да открие грешки, докато работите. (Докато вашият код е синтактично правилен, той все още ще се транслира, но полученият JavaScript може да не работи правилно; помислете за проверката на грешките като еквивалент на проверка на правописа.) Тези IDE също могат да ви помогнат да рефакторирате кода, докато навлизате дълбоко във вашия проект.

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

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

Инсталирайте TypeScript

Готови ли сте да започнете да играете с TypeScript? Инсталирането на езика е лесно. Ако вече използвате Node.js на вашата машина за разработка, можете да използвате NPM, мениджъра на пакети Node.js, за да го инсталирате. Официалният урок за TypeScript за 5 минути ще ви преведе през процеса.

TypeScript може да бъде инсталиран и като плъгин към избраната от вас IDE, което ще ви даде предимствата за инструментариума, за които говорихме по-горе, а също така ще се погрижи за процеса на компилиране на TypeScript в JavaScript. Тъй като TypeScript е разработен от Microsoft, не е изненадващо, че има налични висококачествени приставки за Visual Studio и Visual Studio Code. Но като проект с отворен код TypeScript е адаптиран навсякъде, вариращ от IDE с отворен код като Eclipse до почтени текстови редактори като Vim. И целият проект може да бъде разгледан и изтеглен от GitHub.

Синтаксис на TypeScript

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

Типове TypeScript

Очевидно най-важната синтактична характеристика в TypeScript е системата на типа. Езикът поддържа редица основни типове:

  • Boolean: Проста стойност true / false.
  • Номер: В TypeScript, както и в JavaScript, всички числа са стойности с плаваща запетая - няма отделно цяло число. TypeScript поддържа десетични, шестнадесетични, двоични и осмични литерали.
  • Низ: низ от текстови данни. Можете да използвате единични или двойни кавички, за да обградите низа си, когато задавате данните. Можете също да използвате обратни връзки ( `), за да заобиколите низове с множество редове и можете да вградите изрази в низ със синтаксиса ${ expr }.
  • Масиви и кортежи: Тези типове ви позволяват да съхранявате множество стойности в определена последователност. В масив, отделните стойности са от един и същи тип данни, докато в набор могат да бъдат разнородни. Методът TypeScript forEach()се използва за извикване на функция за всеки елемент в масив.
  • Enum: Подобно на типа със същото име в C #, TypeScript enum ви позволява да присвоите четими от човека имена на поредица от числови стойности.
  • Всякаква: Това е тип за променлива, при която не е задължително предварително да знаете с каква стойност ще завърши - може да вземе стойностите си от потребителски вход или библиотека на трета страна, например.
  • Обект: Това е типът, който представлява всичко, което не е примитивен тип; това е от съществено значение за обектно-ориентираната природа на TypeScript.

Има два различни начина за изрично присвояване на тип на променлива. Първият е синтаксис на ъгловите скоби:

let someValue: any;

нека strLength: number = (someValue) .length;

И второто е asсинтаксис:

let someValue: any = "това е низ";

нека strLength: number = (someValue като низ) .length;

Тези кодови фрагменти, взети от документацията на TypeScript, са функционално еквивалентни. И двете определят someValueкато променлива от тип anyи присвояват "this is a string"като нейната стойност, след това определят strLengthкато число и присвояват като своя стойност дължината на съдържанието на someValue.

Типовете TypeScript също могат да бъдат зададени чрез извод. Тоест, ако зададете стойност от x на 7, без да установите какъв тип е x, компилаторът ще приеме, че x трябва да е число. При някои обстоятелства компилаторът може да направи извод за anyтип, въпреки че можете да използвате флагове за компилация, за да сте сигурни, че няма.

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

TypeScript интерфейс

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

TypeScript генерици

TypeScript също споделя концепцията за генерични продукти с обектно-ориентирани езици като Java и C #. (Еквивалентното съоръжение в C ++ се нарича шаблон.) В TypeScript родовите компоненти могат да работят върху различни типове, а не само върху един, в зависимост от това къде в кода се извикват тези компоненти. Ето един много прост пример от документацията на TypeScript. Първо, помислете за тази функция, която приема аргумент и след това веднага го връща:

идентичност на функцията (arg: всяка): всяка {

    аргумент за връщане;

}

Тъй като функцията е дефинирана с anyтипа, тя ще приеме аргумент от какъвто и да е тип, който изберете да хвърлите върху нея. Това, което връща обаче, ще бъде от anyтипа. Ето версия на функцията, използваща генерични продукти:

идентичност на функцията (arg: T): T {

    аргумент за връщане;

}

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

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

Клас TypeScript 

При обектно-ориентираното програмиране класовете наследяват функционалността и от своя страна служат като градивни елементи на обектите. JavaScript традиционно не използва класове, вместо да разчита на функции и наследяване, базирано на прототип, но концепцията е добавена към езика като част от версията на стандарта ECMAScript 2015. Класовете вече бяха част от TypeScript и сега TypeScript използва същия синтаксис като JavaScript. Едно от предимствата на компилатора на TypeScript е, че той може да трансформира код с JavaScript класове в стар код на JavaScript, който съответства на стандартите преди 2015 г.

Дата на TypeScript

Налични са редица методи и обекти за получаване и настройка на датата и часа в TypeScript, наследени предимно от JavaScript. JavaTPoint има добро описание на това как работи.

Урок за TypeScript 

Готови ли сте да влезете по-дълбоко? Ускорете с тези уроци по TypeScript:

  • TypeScript за 5 минути ще ви преведе през процеса на инсталиране на TypeScript, ако още не сте го направили.
  • Този урок на Visual Studio Code демонстрира как IDE наистина добавят към вашата производителност при разработване на TypeScript.
  • Урок за TypeScript за начинаещи: Липсващото ръководство е наистина задълбочено въведение, което ще бъде полезно, дори ако имате доста ограничен опит с JavaScript.

Ако искате да научите как да използвате TypeScript с React, библиотеката на JavaScript за изграждане на потребителски интерфейси, разработена от Facebook, вижте Как да използвате TypeScript с React и Redux от Ross Bulat и раздела за React и webpack в документацията на TypeScript. Приятно учене!