Slides about the presentation of Jan van Helvoort on the DUUG meetup of 25 september 2014 about Typescript.

1. TYPESCRIPT
DUUG 25 SEPTEMBER 2014
4F
)F1)F '1**-/FžF F3+ -/F¥F´%)1# '1**-/

2. TYPESCRIPT LETS YOU WRITE JAVASCRIPT
THE WAY YOU REALLY WANT TO.

3. TYPESCRIPT
4+ .
)/ -! .
'.. .
*0' .
0)/$*).
) -$.

4. JAVASCRIPT
TYPESCRIPT IS A TYPED SUPERSET OF JAVASCRIPT THAT COMPILES TO PLAIN JAVASCRIPT.

5. BENEFITS
*(+$' -
4+ F.! /4
0/*F*(+' /$*)
'-/$*)F!$' .F¨ F

6. $)F
©
)0'-‡%.F )

7. TYPES
/-$)
0( -
**' )
--4
)0(
)4
*$

8. STRING / NUMBER / BOOLEAN
var name: string = 'Jan';
var age: number = 24;
var isDutch: boolean = true;
name = isDutch;
))*/F*)1 -/FÞ**' )ÞF/*FÞ./-$)Þ‡

9. ARRAY
var list: number[] = [1, 2, 3];
list.push(4);
list.push('five');
*0'F)*/F++'4F/4+ FÞ)0( -ÞF/*F-0( )/FtF2#$#F$.F*!F/4+ FÞ./-$)Þ‡

10. ENUM
enum Countries { 'Netherlands', 'Belgium', 'Unkown' }
var country: Countries = Countries.Netherlands;

11. ANY
var notSure: any = 4;
notSure = maybe a string instead;
notSure = false; // okay, definitely a boolean

12. INTERFACES
interface IPerson {
Name: string;
Country: Countries;
IsDutch: boolean;
callName(): string;
}

13. INTERFACES
class person implements IPerson {
}
'..F+ -.*)F '- .F$)/ -! F -.*)F0/F* .F)*/F$(+' ( )/F$/‰
4+ FÞ+ -.*)ÞF$.F($..$)F+-*+ -/4FÞ( ÞF!-*(F/4+ FÞ -.*)Þ‡
4+ FÞ+ -.*)ÞF$.F($..$)F+-*+ -/4FÞ*0)/$ .ÞF!-*(F/4+ FÞ -.*)Þ‡
4+ FÞ+ -.*)ÞF$.F($..$)F+-*+ -/4FÞ .0/#ÞF!-*(F/4+ FÞ -.*)Þ‡
4+ FÞ+ -.*)ÞF$.F($..$)F+-*+ -/4FÞ''( ÞF!-*(F/4+ FÞ -.*)Þ‡

14. CLASSES
class person implements IPerson {
public Name: string;
public Country: Countries;
public IsDutch: boolean;
constructor(name: string, country: Countries, isDutch: boolean) {
this.Name = name;
this.Country = Countries.Netherlands;
this.IsDutch = isDutch;
}
callName() {
return this.Name;
}
}

15. CLASSES - A SHORTER WAY
class person implements IPerson {
constructor(public Name: string, public Country: Countries,
public IsDutch: boolean) { }
callName() {
return this.Name;
}
}

16. NEW CLASS
var dave = new person('Dave Woestenborghs', Countries.Belgium, false);

17. GENERICS
function identityT(arg: T): T {
return arg;
}
var output = this.identitystring('one');
var output = this.identitystring(1);
0++'$ F+-( / -.F*F)*/F(/#F)4F.$)/0- F*!F''F/- /‰
*0'F)*/F++'4F/4+ FÞ./-$)ÞF/*F-0( )/FtF2#$#F$.F*!F/4+ FÞ)0( -Þ‡

18. TOOLS
$.0'F/0$*FustvF0+/ Fu
$.0'F/0$*FustuF¨ F

19. $)F
©
0'$( F 3/F¨ F

20. $)F
©
(.F¨ F

21. $)F
©
$(F¨ F

22. $)F
©

23. DEMO