Learn TypeScript page

This course covers the basic essentials of TypeScript. At the end, you should be ready to develop projects in TypeScript.

Before You Begin

Click here to join
Bitovi's Slack Community

Join Bitovi's Slack Community to get help on Bitovi Academy courses or other Angular, React, CanJS and JavaScript problems.

Please ask questions related to TypeScript in the Angular chat room.

If you find bugs in this training or have suggestions, create an issue or email contact@bitovi.com.

TypeScript is a typed superset of JavaScript that compiles to plain JavaScript.

Angular and many other frameworks use TypeScript to take advantage of its typechecking magic. While TypeScript may mean a bit of a learning curve for new developers, this guide covers the basics of TypeScript and work through examples to learn to harness the power of TypeScript.

Outline

  • Why TypeScript - learn what TypeScript is and how to compile it.
  • IDE Support - configure TypeScript and learn about different IDEs that help support TypeScript development.
  • Types - understand basic types and how to enforce them.
    let isCarnivore: boolean = true;
    
  • Functions - how to annotate functions parameters and return values, different parameter types available, and how to bind this.
    function add(x: number, y: number): number {
      return x + y;
    }
    
  • Classes - using classes and inheritance in TypeScript, explaining the constructor method, and using public, private, protected, and readonly modifiers.
    class ParkEmployee {
      name: string;
      constructor(name) { this.name = name; }
      sayHi() {
        console.log(`Hi, my name is ${this.name}`);
      }
    }
    
  • Interfaces - writing Interfaces, setting optional properties, and the power of using interfaces in classes and functions.
    interface Dinosaur {
      name: string;
      breed: string;
      height: number;
      location: string;
    }
    
  • Generics - explaining what generics are, why they are useful, and how to create a linked list using generics in TypeScript.
    class GenericCollection<T> {
      private list: T[];
      pushItem(thing:T) {
        this.list.push(thing);
      }
    }