Jak przenieść swój program JavaScript do TypeScript

Pierwotnie wydany w 1995 roku, po zdumiewająco krótkim okresie rozwoju, JavaScript stał się od tego czasu integralną częścią wielu witryn i aplikacji. Dzisiaj JavaScript znalazł zastosowanie zarówno w aplikacjach klienckich, jak i serwerowych. Deweloperzy wciąż żądają wielu funkcji, pomimo wszystkich zmian, jakich doświadczył na przestrzeni lat.

TypeScript to język skryptowy, który rozszerza JavaScript o wiele z tych długo oczekiwanych funkcji. Adnotacja typu, niestandardowe pisanie i interfejsy to główne komponenty, wraz z lepszymi narzędziami zwiększającymi produktywność.

Po co zawracać sobie głowę przełączaniem?

Perspektywa zmiany języków przy dużych projektach może być stresująca. Na szczęście dla każdego, kto rozważa to zadanie, proces przenoszenia projektu z JavaScript do TypeScript jest dość prosty.

JavaScript spędził ostatnie kilka lat, zyskując popularność jako główny język programowania. Pierwotnie używany tylko do tworzenia skryptów front-end na stronach internetowych, wydanie Node.js przeniosło stronę JavaScript na serwer, pomagając zwiększyć jego popularność.

Chociaż JavaScript stał się ostatnio znacznie bardziej popularny, wciąż brakuje wielu funkcji w jego najnowszej implementacji, ES6. Dla wielu programistów te brakujące funkcje ograniczają użyteczność JavaScript jako języka.

TypeScript ma na celu rozwiązanie tych problemów poprzez dodanie do JavaScriptu dodatkowych funkcji, a następnie transponowanie kodu użytkownika. Rezultatem jest bezpieczny typowo język z łatwością i użytecznością JavaScript.

Istnieje już kilka narzędzi i platform z pełną obsługą języka TypeScript. Angular używa go od dawna, a nawet React ma sposoby na implementację TypeScript.

TypeScript jest jak ulepszony JavaScript

TypeScript implementuje wiele funkcji, o które często proszą programiści w JavaScript. Nazwa TypeScript pochodzi od pełnego systemu typów, który implementuje, w tym funkcji takich jak sprawdzanie typów, bezpieczeństwo i niejawne pisanie. TypeScript pozwala nawet na to definiować i używać niestandardowych przestrzeni nazw.

TypeScript zawiera również interfejsy, wyliczenia i wnioskowanie o typie. TypeScript utrzymuje obsługę funkcji z najnowszej implementacji języka JavaScript obok funkcji starszych i dodaje zestaw nowych funkcji.

Ogólnie rzecz biorąc, TypeScript koncentruje się na stworzeniu bezpieczniejszego procesu programowania z silniejszymi narzędziami pomagającymi programistom.

Zachęca do bezpiecznego kodu typu

TypeScript używa wbudowanego systemu sprawdzania typów do sprawdzania poprawności typów zmiennych. Zawiera zestaw standardowych typów z możliwością zdefiniowania własnych klas i typów. Typy można jawnie zadeklarować lub wywnioskować na podstawie przypisania.

TypeScript ma kilka standardowych typów danych, w tym ciągi znaków, liczby, wartości logiczne i krotki. Istnieją również typy zmiennych, takie jak nieznany i dowolny, które pozwalają na użycie słabo napisanego kodu.

Wnioskowanie o typie TypeScript pozwala przeprowadzać kontrole typów nawet w standardowym kodzie JavaScript, uruchamiając go przez transpilator TypeScript.

Transpilacja sprawia, że ​​jest łatwy w użyciu

Z punktu widzenia programisty jedną z najlepszych cech TypeScript jest to, że generuje waniliowy JavaScript. Możesz uruchomić kod TypeScript za pomocą procesu znanego jako transpilacja, który jest podobny do kompilacji.

Zamiast pliku wykonywalnego, wynikiem transpilacji jest skrypt w języku innym niż oryginalny kod.

Kod TypeScript jest transpilowany do JavaScript, który można następnie uruchomić na serwerze lub kliencie. Pozwala to szybko i łatwo pisać kod, który można uruchomić na prawie każdej platformie.

TypeScript wspomaga produktywność programistów

Dodanie typów do JavaScript nie tylko umożliwia bezpieczne działanie kodu, ale także zapewnia programistom narzędzia ułatwiające kodowanie. Większość nowoczesnych środowisk IDE oferuje obsługę języka TypeScript, która umożliwia narzędziom do uzupełniania kodu, takim jak IntelliSense, oferowanie dodatkowego kontekstu kodu. Może również oferować sprawdzanie typów podczas pisania, pomagając w szybszym wykrywaniu błędów.

Ponadto dodatkowe struktury danych i składnia TypeScript mają na celu zwiększenie czytelności kodu. Te funkcje przyspieszają i ułatwiają tworzenie wysokiej jakości kodu i wykrywanie potencjalnych problemów, zanim staną się problematyczne.

Jak możesz przenieść swój kod?

Jeśli rozpoczynasz zupełnie nowy projekt, tworzenie nowego projektu TypeScript jest całkiem proste. Konwersja istniejącego projektu na TypeScript jest jednak nieco bardziej skomplikowana.

W większości normalnych okoliczności perspektywa konwersji projektu z jednego języka na inny jest przerażająca. Konwersja z JavaScript na TypeScript jest jednak zaskakująco prosta.

TypeScript jako nadzbiór JavaScript

TypeScript jest uważany za nadzbiór języka JavaScript. Oznacza to, że TypeScript dodaje dodatkowe warstwy składni i funkcjonalności, nie zmieniając ani nie usuwając podstawowej funkcjonalności, wokół której się buduje.

Dla programistów oznacza to, że każdy kod działający poprawnie w JavaScript będzie automatycznie działał poprawnie w TypeScript. Niezależnie od tego, czy dany skrypt jest serwerem WWW napisanym do działania w NodeJS, czy zestawem skryptów front-end dla strony internetowej, przełączanie jest wyjątkowo proste.

Po zainstalowaniu transpilatora TypeScript możesz utworzyć plik simple tsconfig.json plik o następującej treści:

{
„Opcje kompilatora”: {
„outDir”: "./zbudować",
„zezwalaj na J”: PRAWDA,
"cel": "es5"
 },
"włączać": ["./źródło/**/*"]
}

Przenieś wszystkie odpowiednie pliki do katalogu src i uruchom transpilator. Spowoduje to utworzenie wynikowych plików JavaScript w formacie zbudować informator.

Te szybkie i proste zmiany przekonwertują standardowy projekt JavaScript na projekt TypeScript. Odtąd możesz swobodnie korzystać z nowych funkcji, które oferuje TypeScript. Możesz dodawać adnotacje do typów w zmiennych, implementować typy niestandardowe i definiować interfejsy.

Po każdej transpilacji możesz użyć danych wyjściowych z pliku zbudować katalog w razie potrzeby, dodając pliki do dowolnego projektu, tak jak zwykle. Transpiler wpisze standardowy JavaScript i przekonwertuje nowe funkcje na poprawne skrypty ES5.

Co musisz wiedzieć, aby przejść od JS do TS

Proces konwersji projektu z JavaScript na TypeScript jest wyjątkowo łatwy. Konwersja jest tak prosta, jak zmiana struktury katalogów, dodanie pliku konfiguracyjnego i zainstalowanie transpilatora.

Wyciągnięcie wszystkich korzyści z nowego języka może być jednak znacznie dłuższym projektem. Chociaż TypeScript może wywnioskować typ każdej zmiennej w projekcie, należy je jawnie zadeklarować. Cofanie się i dodawanie niestandardowych typów do projektu, dodawanie odpowiednich adnotacji i tworzenie interfejsów może być czasochłonne.

Dodanie tych funkcji do projektu pozwoli jednak czerpać korzyści płynące z właściwego sprawdzania typów i rozszerzonego oprzyrządowania. Duże projekty będą szybsze i łatwiejsze do zbudowania, wcześniej zidentyfikujesz błędy, a nowi programiści będą mieli łatwiejszy czas na czytanie Twojego kodu.