ТипеСцрипт утире свој пут као један од најпопуларнијих програмских језика за модерне организације.
ТипеСцрипт је компајлирани, строго откуцани ЈаваСцрипт суперсцрипт (изграђен на врху ЈаваСцрипт језика). Овај статички откуцани језик, који је развио и одржава Мицрософт, подржава објектно оријентисане концепте као што је његов подскуп, ЈаваСцрипт.
Овај програмски језик отвореног кода има много случајева употребе, као што је креирање веб, великих и мобилних апликација. ТипеСцрипт се може користити за фронтенд и бацкенд развој. Такође има различите оквире и библиотеке које поједностављују развој и проширују случајеве његове употребе.
Зашто користити ТипеСцрипт са Ноде.јс? Овај чланак ће говорити о томе зашто се ТипеСцрипт сматра „бољим“ од ЈаваСцрипт-а, како га инсталирати користећи Ноде.јс, конфигурисати и креирати мали програм користећи ТипеСцрипт и Ноде.јс.
Преглед садржаја
ТипеСцрипт са Ноде.јс: Предности
- Опционо статичко куцање: ЈаваСцрипт се динамички куца, што значи да се тип података променљиве одређује током времена извршавања, а не током компајлирања. С друге стране, ТипеСцрипт нуди опционо статичко куцање, што значи да када једном декларишете променљиву, она неће променити њен тип и узимаће само одређене вредности.
- Предвидљивост: Када се бавите ТипеСцрипт-ом, постоји гаранција да ће све што дефинишете остати исто. На пример, ако декларишете одређену променљиву као Боолеан, она никада не може да се промени у стринг успут. Као програмер, сигурни сте да ће ваше функције остати исте.
- Лако уочити грешке рано: ТипеСцрипт рано открива већину грешака у типу, тако да је њихова вероватноћа преласка у производњу мала. Ово смањује време које инжењери троше на тестирање кода у каснијим фазама.
- Подржано на већини ИДЕ-ова: ТипеСцрипт ради са већином интегрисаних развојних окружења (ИДЕ). Већина ових ИДЕ-а обезбеђује довршавање кода и истицање синтаксе. Овај чланак ће користити Висуал Студио Цоде, још један Мицрософт производ.
- Лак за рефакторисање кода: Можете ажурирати или рефакторисати своју ТипеСцрипт апликацију без промене њеног понашања. Присуство алата за навигацију и ИДЕ који разуме ваш код олакшава рефакторисање базе кода без напора.
- Користи постојеће пакете: Не морате да креирате све од нуле; можете користити постојеће НПМ пакете са ТипеСцрипт-ом. Овај језик такође има јаку заједницу која одржава и креира дефиниције типова за популарне пакете.
Како користити ТипеСцрипт са Ноде.јс
Иако ТипеСцрипт има ове предности, савремени претраживачи не могу да прочитају његов код у обичном облику. Према томе, ТипеСцрипт код мора прво да се транспилира у ЈаваСцрипт код да би се покренуо у претраживачима. Добијени код ће имати исту функционалност као оригинални ТипеСцрипт код и додатне функције које нису доступне у ЈаваСцрипт-у.
Предуслови
- Ноде.јс: Ноде је окружење за извршавање на више платформи које омогућава покретање ЈаваСцрипт кода ван окружења претраживача. Помоћу ове команде можете проверити да ли је чвор инсталиран на вашој машини;
чвор -в
У супротном, Ноде.јс можете преузети са званичне веб странице. Поново покрените горњу команду након инсталације да бисте проверили да ли је добро конфигурисана.
- Ноде Пацкаге Манагер: Можете користити НПМ или Иарн. Први се подразумевано инсталира када инсталирате Ноде.јс. Користићемо НПМ као менаџер пакета у овом чланку. Користите ову команду да проверите њену тренутну верзију;
нпм -в
Инсталирање ТипеСцрипт-а са Ноде.јс
Корак 1: Подесите фасциклу пројекта
Почећемо тако што ћемо креирати фасциклу пројекта за ТипеСцрипт пројекат. Овом фолдеру можете дати било које име по свом укусу. Можете користити ове команде да бисте започели;
мкдир типесцрипт-ноде
цд типесцрипт-ноде
Корак 2: Покрените пројекат
Користите нпм да иницијализујете свој пројекат помоћу ове команде;
нпм инит -и
Горња команда ће креирати датотеку пацкаге.јсон. Ознака -и у команди говори нпм-у да укључи подразумеване вредности. Генерисана датотека ће имати сличан излаз.
{
"name": "typescript-node",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo "Error: no test specified" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC"
}
Конфигурисање ТипеСцрипт-а са Ноде.јс
Корак 1: Инсталирајте ТипеСцрипт преводилац
Сада можете инсталирати ТипеСцрипт компајлер у свој пројекат. Покрените ову команду;
нпм инсталл –саве-дев типесцрипт
Излаз на вашој командној линији ће бити нешто сличан овоме;
added 1 package, and audited 2 packages in 26s found 0 vulnerabilities
Напомена: Горњи приступ инсталира ТипеСцрипт локално у фасциклу пројекта на којој радите. Можете да инсталирате ТипеСцрипт глобално на свој систем, тако да не морате да га инсталирате сваки пут када радите на пројекту. Користите ову наредбу за глобално инсталирање ТипеСцрипт-а;
npm install -g typescript
Помоћу ове команде можете проверити да ли је ТипеСцрипт инсталиран;
tsc -v
Корак 2: Додајте Амбиент Ноде.јс типове за ТипеСцрипт
ТипеСцрипт има различите типове, као што су имплицитни, експлицитни и амбијентални. Амбијентални типови се увек додају у глобални опсег извршавања. Користите ову команду за додавање амбијенталних типова;
нпм инсталл @типес/ноде –саве-дев
Корак 3: Направите датотеку тсцонфиг.јсон
Ово је конфигурациона датотека која наводи све опције превођења ТипеСцрипт-а. Покрените ову команду која долази са неколико дефинисаних опција компајлирања;
npx tsc --init --rootDir src --outDir build --esModuleInterop --resolveJsonModule --lib es6 --module commonjs --allowJs true --noImplicitAny true
Ово ће бити излаз на терминалу;
Биће генерисана датотека тсцонфиг.јсон, која садржи неке подразумеване вредности и коментаре.
тсцонфиг.јсон фајл
Ово је оно што смо конфигурисали:
- РоотДир је место где ће ТипеСцрипт тражити наш код. Усмерили смо га у фасциклу /срц где ћемо написати наш код.
- ОутДир фолдер дефинише где се компајлирани код ставља. Такав код је конфигурисан да се чува у фасцикли буилд/.
Коришћење ТипеСцрипт-а са Ноде.јс
Корак 1: Креирајте срц фасциклу и индек.тс датотеку
Сада имамо основну конфигурацију. Сада можемо да креирамо једноставну апликацију ТипеСцрипт и да је компајлирамо. Екстензија датотеке за ТипеСцрипт датотеку је .тс. Покрените ове команде док сте унутар фасцикле коју смо креирали у претходним корацима;
мкдир срц
додирните срц/индек.тс
Корак 2: Додајте код у ТипеСцрипт датотеку (индек.тс)
Можете почети са нечим једноставним као што је;
console.log('Hello world!')
Корак 3: Преведите ТипеСцрипт код у ЈаваСцрипт код
Покрените ову команду;
npx tsc
Можете проверити фасциклу за изградњу (буилд/индек.јс) и видећете да је индек.јс генерисан са овим излазом;
ТипеСцрипт је компајлиран у ЈаваСцрипт код.
Корак 4: Покрените преведени ЈаваСцрипт код
Запамтите да ТипеСцрипт код не може да се покреће у прегледачима. Тако ћемо покренути код у индек.јс у фасцикли за изградњу. Покрените ову команду;
node build/index.js
Ово ће бити излаз;
Корак 5: Конфигуришите ТипеСцрипт за аутоматско превођење у ЈаваСцрипт код
Ручно превођење ТипеСцрипт кода кад год промените своје ТипеСцрипт датотеке може изгубити време. Можете инсталирати тс-ноде (покреће ТипеСцрипт код директно без чекања да буде преведен) и нодемон (проверава промене у вашем коду и аутоматски поново покреће сервер).
Покрените ову команду;
npm install --save-dev ts-node nodemon
Затим можете отићи до датотеке пацкаге.јсон и додати ову скрипту;
"scripts": {
"start": "ts-node ./src/index.ts"
}
Можемо користити нови блок кода у сврху демонстрације;
function sum (num1:number, num2:number, num3:number){
return num1 + num2 +num3;
}
console.log(sum(10,15,30))
Избришите датотеку индек.јс (/буилд/индек.јс) и покрените нпм старт.
Ваш излаз ће бити сличан овоме;
збир 3 броја
Конфигуришите ТипеСцрипт Линтинг са еслинт-ом
Корак 1: Инсталирајте еслинт
Линтинг може бити користан ако желите да одржите доследност кода и ухватите грешке пре извођења. Инсталирајте еслинт користећи ову команду;
npm install --save-dev eslint
Корак 2: Иницијализујте еслинт
Можете иницијализовати еслинт користећи ову команду;
npx eslint --init
Процес иницијализације ће вас провести кроз неколико корака. Користите следећи снимак екрана да вас води кроз;
Када се процес заврши, видећете датотеку под називом .еслинтрц.јс са садржајем сличним овом;
module.exports = {
env: {
browser: true,
es2021: true
},
extends: 'standard-with-typescript',
overrides: [
],
parserOptions: {
ecmaVersion: 'latest',
sourceType: 'module'
},
rules: {
}
}
Корак 3: Покрените еслинт
Покрените ову команду да бисте проверили и линтирали све датотеке са екстензијом .тс;
npx eslint . --ext .ts
Корак 4: Ажурирајте пацкаге.јсон
Додајте линт скрипту овој датотеци за аутоматско линтинг.
"scripts": {
"lint": "eslint . --ext .ts",
},
ТипеСцрипт са Ноде.јс: Најбоље праксе
- Одржавајте ТипеСцрипт ажурним: Програмери ТипеСцрипт-а увек објављују нове верзије. Уверите се да имате инсталирану најновију верзију на вашој машини/фасцикли пројекта и да искористите нове функције и исправке грешака.
- Омогући строги режим: Можете ухватити уобичајене програмске грешке у време компајлирања када омогућите строги режим у датотеци тсцонфиг.јсон. Ово ће смањити ваше време за отклањање грешака, што ће довести до веће продуктивности.
- Омогућите строге нулте провере: Можете ухватити све нулте и недефинисане грешке у време компајлирања тако што ћете омогућити строге провере нуле у датотеци тсцонфиг.јсон.
- Користите уређивач кода који подржава ТипеСцрипт: постоји много уређивача кода. Добра пракса је да одаберете уређиваче кода као што су ВС Цоде, Сублиме Тект или Атом који подржавају ТипеСцрипт преко додатака.
- Користите типове и интерфејсе: Помоћу типова и интерфејса можете дефинисати прилагођене типове које можете поново користити у целом пројекту. Такав приступ ће ваш код учинити модуларнијим и лакшим за одржавање.
Окончање
Сада имате основну структуру апликације креиране помоћу ТипеСцрипт-а на Ноде.јс. Сада можете да користите обичне пакете Ноде.јс, али ипак, напишите свој код у ТипеСцрипт-у и уживајте у свим додатним функцијама које долазе са овим другим.
Ако тек почињете да користите ТипеСцрипт, уверите се да разумете разлике између ТипеСцрипт-а и ЈаваСцрипт-а.