Typescript at LMU München

Note: all types in TS are lowercase

1) number

2) string

3) boolean

4) object (key types can be added)

e.g. const person = {

   name: string;

   age: number;

} = {

   name: "Max",

   age: 23

}

5) Array (e.g. string[])

6) Tuple (e.g. [number, string])

Attention: push() works also with 1 element only

7) enum 

e.g. enum Role { ADMIN, READ_ONLY, AUTHOR }

8) any (e.g. any[] or any) <-- to avoid!!!

9) union (e.g. string | number)

Note: additional runtime type checking might be necessary

10) literal (e.g. 'as-string' | 'as-number') with union

11) custom type/type alias (e.g.

1. type User = { name: string; age: number };

)

12) function return type (e.g. function add(n1: number, n2: number): number) & void

Note: a functions type should be void not undefined when it returns nothing

13) Function (e.g. let func = add: Function) & function types (e.g. let func = add: (a: number, b: number) => number (2 params, returns 1 number))

14) callback type (e.g. cb: (num: number => void) where void tells that we are not interested in a return value)

15) unknown (better than any)

16) never (e.g. when a function never returns)

17) Intersection Type & (to combine 2 types or interfaces)

Example:

const age = 28;

Typescript infers/assumes that this age is constant and uses number. So you don't need to explicitly add a type (like const age:number = 28).

Type inference also happens for functions

e.g.

constructor(private read-only id: string) {

  this.id = id

}

a class which is abstract and has abstract functions. It forces child classes to implement the abstract functions. It cannot be instantiated but has to be extended by a child class

With a private constructor and a static method which either returns an instance or creates a new instance if no instance is declared yet.

1. To check the type during run-time, as multiple types are in play

• typeof
• instanceof
• in

Note: type guards don't work with interfaces as they are not compiled to JS

2. every interface has a  type prop. In a function define a switch statement to catch the types.

3. 2 possibilities:

a) <typesomething>document.getElementById('.id');

b) document.getElementById('.id') as typesomething;

4. If you are sure that an expression will not be null

document.getElementById('.id')!

when you don't know yet what properties (and how many) an interface will have

e.g. [prop: string]: string

Note: it restricts the type to only use the index properties type (here string)

when a function has several function definitions with different types

? operator checks if value is undefined (see ruby)

?? operator, to capture undefined & null

e.g. const var = variable ?? "something";

falls back to something

Note: empty string falls to variable

When you want to create a utility (such as Math.x) or don't need an instance of the class

metaphor: pill

Encapsulation means bundling properties and methods in a class to shield them from the outside (information hiding) . The hidden parts are only accessible through getters and setters. 

e.g. a class that holds variables and methods