co-to-typescript

Co to TypeScript

TypeScript jest to język programowania tworzony w modelu open-source będący semantycznie nadzbiorem JavaScriptu. Główny zespół odpowiadający za jego utrzymanie pracuje w Microsoft.

O co chodzi z semantycznym nadzbiorem? Składnia języka jest niemal identyczna z JavaScript. TypeScript dodaje trochę dodatkowych rzeczy jak na przykład statyczne typowanie czy interfejsy.

Można powiedzieć też, że każdy kod napisany w JavaScript możemy skopiować do pliku .ts (rozszerzenie dla plików TypeScript) i wszystko będzie działać poprawnie.
Nie jest to jednak do końca prawda, przynajmniej nie przy domyślnych ustawieniach kompilatora TypeScript. Jeśli zluzujemy nieco różne obostrzenia to dopiero wówczas KAŻDY kod JavaScript uruchomi się jako kod TypeScript.

TypeScript jest kompilowany do czystego JavaScriptu. Na przykład wspomniane typy, najważniejsza cecha TypeScript, nie występują w trakcie działania programu (runtime). Jeśli skompilujemy kod z pliku .ts do pliku .js i uruchomimy w przeglądarce to nie będzie miała ona pojęcia, jakie typy gdzie ustawiliśmy, bo one nie istnieją w ECMAScript.

Przykładowy kod

Prosta klasa TypeScript (nie przejmuj się jeśli nie rozumiesz do konca o co w niej chodzi) wygląda tak:

class Greeter {

   private name: string;

   constructor(name: string) {
       this.name = name;
   }

   public greet(): string {
       return `Hello ${this.name}!`;
   }

}


console.log(new Greeter("Pawel").greet());

i jest on kompilowany do poniższego kodu JavaScript

var Greeter = /** @class */ (function () {
   function Greeter(name) {
       this.name = name;
   }
   Greeter.prototype.greet = function () {
       return "Hello " + this.name + "!";
   };
   return Greeter;
}());
console.log(new Greeter("Pawel").greet());

Microsoft udostępnia kompilator online, który pozwala przetestować małe kawałki kodu TypeScript i sprawdzić na jako kod są one kompilowane. Zabawka ta znajduję się tutaj https://www.typescriptlang.org/play/

Dlaczego TypeScript?

Skoro więc kompiluje się on do JavaScript to, co to TypeScript ma takiego, że warto w nim pisać zamiast od razu tworzyć pliki .js i dlaczego korzystają z niego tacy giganci jak Google, Netflix, LinkedIn, Facebook i wiele, wiele innych firm?

Podpowiedź jest już w nazwie – Types – czyli wspomniane już typy. Koniec z zastanawianiem się, czy dana funkcja w JavaScript oczekuję 24, czy “24”. Czy może autor obsłużył oba przypadki? W TS mówimy wprost, że dana funkcja przyjmuje parametr typu tekstowego albo liczbowego. Oczywiście podstawowe typy tego typu to tylko początek. Możemy tworzyć własne. Koniec z komentowaniem funkcji w JavaScripcie “proszę, proszę przesyłaj do tej funkcji tylko liczby”.

Już ta jedna cecha w gigantyczny sposób ułatwia utrzymanie kod i pracę w dużych, rozbitych na wiele podprojektów, aplikacjach oraz ich rozwój.

Oczywiście typu to nie wszystko. TypeScript dostarcza też interfejsy, generyki, modyfikatory dostępu, abstrakcje… cały świat programowania obiektowego. Dzięki temu programiści z języków takich jak Java czy C# bardzo szybko odnajdą się w świecie TS i może on stanowić dla nich swoistą bramę do świata front-endu, tak jak było to w moim przypadku.

Dzięki temu popularność TypeScript rośnie nieprzerwanie od roku 2015, gdy na przykład Angular 2+, z którym to TypeScript był początkowo głównie kojarzony, zaczyna odnotowywać spadki. Coraz częściej TypeScripta zaczyna się używać z React czy NodeJS.

Części składowe

TypeScript jako taki składa się z trzech częsci:

  • języka programowania jako takiego
  • serwer języka  – program, który karmi danymi Twoje IDE (bądź edytor kodu). Dodaje autouzupełnianie, sprawdza typy w locie, dodaje różnego rodzaju podpowiedzi do kodu, które potem IDE wyświetla. Tak więc jeśli w Visual Studio Code (bezdyskusyjnie najlepszy edytor kodu spośród tych darmowych) najedziesz na taki kawałek kodu TypeScript:
    let data = [ 1, 4, 5, 3];
    to pojawi się tooltip let data : number[], który podpowiada nam, że kompilator języka wykrył, że typ zmiennej data to tablica liczb.
  • kompilator – program, który karmi się plikami .ts, sprawdza typy i składnie. Zamienia to wszystko na (mniej lub bardziej) klasyczny JavaScript. Jest używany przez serwer języka bądź wołamy go sami w czasie budowania naszej aplikacji.

Wady

Po pierwsze TypeScript to tylko narzędzie, które to trzeba wiedzieć kiedy jest przydatne, a kiedy nie. Tworząc proste projekty może się okazać, że TypeScript będzie tylko nadmiarową warstwą do opanowania.

Kolejną sprawą jest fakt, że użycie TypeScript’u doda kolejny zestaw narzędzi do opanowania w już pokaźnym zestawie z jakiego trzeba korzystać tworząc aplikacje webowe oraz kolejny klocek do wpięcia w nasz proces budowy aplikacji, na przykład dodane kroku kompilacji TS do Webpacka. Co prawda obecnie jest to już całkiem wygodnie obsłużone, co nie zmienia jednak faktu, że to dodatkowa rzecz do nauki.

Dodatkowo dochodzi cała gama błędów powiązana z nieodpowiednim używaniem obiektowego stylu programowania, ale to już bardziej kwestia twórcy kodu niż samego TypeScripta.

Zapraszam do dołączenia do newslettera

Część druga kursu – minimalistyczny projekt.

4 myśli w temacie “Co to TypeScript”

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *