Kas yra typescript? Jo privalumai.

Sveiki

Ieškau internete, bet sunkiai sekasi suprasti kas yra typescriptas ir kokie būtų jo privalumai. Kolkas sugebėjau suprasti lyg tai tai, kad typescriptas yra sukompiliuojamas į js ir taip galima pradebuginti. Dar ten mačiau pavyzdžių kad galima naudoti tipus, klases ir interfeisus kaip privalumą, nes js`e to nėra, bet jeigu aš tarkim programinu ir tų interfeisų beveik niekada nenaudoju, tai tada kame tas privalumas? Gal yra dar kažkas kažkokie subtilumai?

Bloga informacija dėl to kad JS nėra Class. Dėl interface, nežinau ar yra, niekad nereikėjo.

Dėl pačio typescript. Na bent jau man per 12 metų patirtį ir kuriant enterpise Cloud projektus, niekad jo neprireikė, ir nemanau kad prireiks...

EDIT:

Dėl JS Class

class Testas { 
 testas() { 
   console.log("Output'as: testas"); 
 } 
} 
var test = new Testas(); 
test.testas();

Su JavaScript:

function plus(a, b) {
 return a + b;
}

// kažkas visai neįsivaizduodamas kaip veikia ši funkcija, parašo tokią eilutę:
plus(5, {});
// grąžinama "5[object Object]"

Su TypeScript gali padaryti šitaip:

function plus(a: number, b: number) {
 return a + b;
}

// kažkas visai neįsivaizduodamas kaip veikia ši funkcija, parašo tokią eilutę:
plus(5, {});
// kompiliatorius išmes klaidą, kad "{}" nepriklauso tipui "number"

Kitaip tariant, TypeScript leidžia tau nurodyti, koks yra kintamojo ar parametro tipas ir pasirūpina, kad nepridarytum nesąmonių (plius dar kitos savybės).

Kodėl tai naudinga? Nurodžius kintamiesiems tipus sunkiau padaryti klaidų, kur paduodi ne tai, ką iš tikrųjų norėjai paduoti. Kitaip tariant, suteikiama kalbai saugumo. Atitinkamai nereikia tiek nuodugniai testuoti viso kodo, nes dalį testavimo atlieka kompiliatorius.

https://en.wikipedia.org/wiki/Type_system

https://en.wikipedia.org/wiki/Strong_and_weak_typing

/thread

Sveikas,

TypeScript (.ts), yra konvertuojamas į (.js), taip nereikia naudoti Babel, nes jau gali nustatyti savo target pvz.: es3. Taip gali rašyti kodą palaikintį pačius naujausius standartus ir jie visi bus kompiliuojami į seną target (es3), pvz.: class Vartotojas bus sukompiliuotas į funkciją, nes klasės atsirado tik nuo es2015 ir pnš. +

TypeScript (.ts) turi būti kompiliuojamas į (.js), kiekvieną kartą turėsi kompiliuoti (.ts) į (.js) ir dar pridėti source maps, kad žinotum, kur yra klaidos tavo (.ts). -

TypeScript turi interface (implements ...), tipus (vardas: string), intellisense (geresnis autocomplete), patikrinimą dėl errorų, enums ir pnš. +

Turėsi mokintis ne tik JS, bet ir TS. -

Labai praverčia didelėms projektams, taip yra išvengiama daug klaidų ir yra daug aiškiau, kam ir kaip reikalingas N metodas/klasė ir pnš, nes jie turi tipus, taip pat pasiūlo geresnį autocomplete. +

Angular 2 naudoja TypeScript. +

TypeScript tikslas, kad JavaScript būtų suprantamas ir tiems, kurie atėjo iš Java / C# ir pnš, taip lengvai galima suprasti kodą ir back-enderiams. +

class Test {
   public static tekstas: string = 'Uzdarbis.lt';

   static statinisMetodas(skaicius: number) {
       console.log(`Jūsų skaičius yra: ${skaicius}`);
   }
}

Test.statinisMetodas('Labas vakaras'); // Klaida, nes 'statinisMetodas' turi parametrą 'skaicius', kurio tipas nėra 'string', o yra 'number'

Test.tekstas. // Iškarto gausi autocomplete, nes TS žino, kad 'tekstas' yra 'string'

TypeScript:

abstract class Data {
   kokiaDiena() {
       const date: Date = new Date();
       const currentDay: number = date.getDay();

       let day: string;
       switch (currentDay) {
           case 1: day = 'Pirmadienis'; break;
           case 2: day = 'Antradienis'; break;
           case 3: day = 'Trečiadienis'; break;
           case 4: day = 'Ketvirtadienis'; break;
           case 5: day = 'Penktadienis'; break;
           case 6: day = 'Šeštadienis'; break;
           case 7: day = 'Sekmadienis'; break;
           default: throw new Error('Nepavyko nustatyti datos!');
       }

       console.log(`Šiandien yra: ${day.toLowerCase()}`);
   }
}

interface IVartotojas {
   getVardas();
   getPavarde();
   getMobilusis();
   getElPastas();
}

class Vartotojas extends Data implements IVartotojas {
   private vardas: string;
   private pavarde: string;
   private mobilusis: number;
   private elPastas: string;

   constructor(vardas: string, pavarde: string, mobilusis: number, elPastas: string) {
       super();
       this.vardas = vardas;
       this.pavarde = pavarde;
       this.mobilusis = mobilusis;
       this.elPastas = elPastas;
   }

   getVardas(): string { return this.vardas; }
   getPavarde(): string { return this.pavarde; }
   getMobilusis(): number { return this.mobilusis; }
   getElPastas(): string { return this.elPastas; }
   getDiena(): void { super.kokiaDiena(); }
}

JavaScript:

class Data {
   constructor() {
       if (new.target === Data) {
           throw new Error('Abstrakti klasė! Negalima inicializuoti.');
       }
   }

   kokiaDiena() {
       const date = new Date();
       const currentDay = date.getDay();

       let day;
       switch (currentDay) {
           case 1: day = 'Pirmadienis'; break;
           case 2: day = 'Antradienis'; break;
           case 3: day = 'Trečiadienis'; break;
           case 4: day = 'Ketvirtadienis'; break;
           case 5: day = 'Penktadienis'; break;
           case 6: day = 'Šeštadienis'; break;
           case 7: day = 'Sekmadienis'; break;
           default: throw new Error('Nepavyko nustatyti datos!');
       }

       console.log(`Šiandien yra: ${day.toLowerCase()}`);
   }
}

class IVartotojas extends Data {
   constructor() {
       super();

       const mustHaveMethods = ['getVardas', 'getPavarde', 'getMobilusis', 'getElPastas'];
       const targetPrototype = new.target.prototype;

       const methods = mustHaveMethods;
       for (let fn of mustHaveMethods) {
           if (targetPrototype[fn] === undefined) {
               throw new Error(`${targetPrototype.constructor.name} - turi paveldėti likusius metodus (${methods.join(', ')})`);
           }

           let index = methods.indexOf(fn);
           methods.splice(index, 1);
       }
   }
}

class Vartotojas extends IVartotojas {
   constructor(vardas, pavarde, mobilusis, elPastas) {
       super();
       this.vardas = vardas;
       this.pavarde = pavarde;
       this.mobilusis = mobilusis;
       this.elPastas = elPastas;
   }

   getVardas() { return this.vardas; }
   getPavarde() { return this.pavarde; }
   getMobilusis() { return this.mobilusis; }
   getElPastas() { return this.elPastas; }
   getDiena() { super.kokiaDiena(); }
}