Slide 1

Slide 1 text

TypeScript JavaScript on Steroids

Slide 2

Slide 2 text

What is TypeScript ● An open-source language that gets transpiled (transformed) to JavaScript ● Superset of JavaScript and interchangeable with it (adoption is gradual) ● All valid JavaScript code is TS ● Adds static type definition to JS ● Provides annotations and better documentation of JS code ● Validates JS code automatically ● Generates output that runs anywhere (because it's vanilla JS)

Slide 3

Slide 3 text

What it is not ● A fix for JS issues (NaN === NaN being equal to false) ● Meant to replace Javascript ● Meant to be used directly (without being transpiled) ● Fully independent (controlled by Microsoft) ● Babel (something that adds new features and compiles to old JS) ● A definitive solution (JS is evolving quickly and that might kill TS in the future)

Slide 4

Slide 4 text

Transpiling $ tsc Test.ts

Slide 5

Slide 5 text

Variables // All valid const name:string = "Joe" // Declare everything + assign value let name:string; // Declare everything let name; // Declare JS way let name = "Joe" // Declare JS way + assign (type is inferred)

Slide 6

Slide 6 text

Types

Slide 7

Slide 7 text

Types

Slide 8

Slide 8 text

Types

Slide 9

Slide 9 text

Types

Slide 10

Slide 10 text

Types - wildcard If you can't, for some reason, declare a type, use any:

Slide 11

Slide 11 text

Composing Types - Unions Not only can we infer types, but we can restrict them to a set:

Slide 12

Slide 12 text

Composing Types - Unions This also saves you from most of the issues with TS:

Slide 13

Slide 13 text

Composing Types - Generics

Slide 14

Slide 14 text

Composing Types - Generics

Slide 15

Slide 15 text

Composing Types - Generics

Slide 16

Slide 16 text

Composing Types - Generics

Slide 17

Slide 17 text

Structural Type System - a.k.a Duck Typing If it quacks like a duck… It is a duck!

Slide 18

Slide 18 text

Structural Type System - a.k.a Duck Typing

Slide 19

Slide 19 text

Structural Type System - a.k.a Duck Typing

Slide 20

Slide 20 text

Structural Type System - a.k.a Duck Typing

Slide 21

Slide 21 text

Interfaces - can be merged

Slide 22

Slide 22 text

Interfaces - can be merged

Slide 23

Slide 23 text

Interfaces - can be merged

Slide 24

Slide 24 text

Enums

Slide 25

Slide 25 text

Enums

Slide 26

Slide 26 text

Livecode - Project

Slide 27

Slide 27 text

There is so much more…

Slide 28

Slide 28 text

Questions?