Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
TYPESCRIPT 
DUUG 25 SEPTEMBER 2014 
4F
)F1)F '1**-/FžF F3+ -/F¥F´%)1# '1**-/
TYPESCRIPT LETS YOU WRITE JAVASCRIPT 
THE WAY YOU REALLY WANT TO.
TYPESCRIPT 
4+ . 
	)/ -! . 
'.. . 

*0' . 
0)/$*). 
 ) -$.
JAVASCRIPT 
TYPESCRIPT IS A TYPED SUPERSET OF JAVASCRIPT THAT COMPILES TO PLAIN JAVASCRIPT.
BENEFITS 
*(+$' - 
4+ F.! /4 
0/*F*(+' /$*) 
 '-/$*)F!$' .F¨ F
$)F 
© 
 
)0'-‡%.F )
TYPES 
/-$) 
0( - 
**' ) 
--4 
)0( 
)4 
*$
STRING / NUMBER / BOOLEAN 
var name: string = 'Jan'; 
var age: number = 24; 
var isDutch: boolean = true; 
name = isDutch;...
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*...
ENUM 
enum Countries { 'Netherlands', 'Belgium', 'Unkown' } 
var country: Countries = Countries.Netherlands;
ANY 
var notSure: any = 4; 
notSure = maybe a string instead; 
notSure = false; // okay, definitely a boolean
INTERFACES 
interface IPerson { 
Name: string; 
Country: Countries; 
IsDutch: boolean; 
callName(): string; 
}
INTERFACES 
class person implements IPerson { 
} 
'..F+ -.*)F '- .F$)/ -! F	 -.*)F0/F* .F)*/F$(+' ( )/F$/‰ 
4+ FÞ+ -.*)ÞF$...
CLASSES 
class person implements IPerson { 
public Name: string; 
public Country: Countries; 
public IsDutch: boolean; 
co...
CLASSES - A SHORTER WAY 
class person implements IPerson { 
constructor(public Name: string, public Country: Countries, 
p...
NEW CLASS 
var dave = new person('Dave Woestenborghs', Countries.Belgium, false);
GENERICS 
function identityT(arg: T): T { 
return arg; 
} 
var output = this.identitystring('one'); 
var output = this.ide...
TOOLS 
$.0'F/0$*FustvF0+/ Fu 
$.0'F/0$*FustuF¨ F
Upcoming SlideShare
Loading in …5
×

DUUG meetup Colours - Typescript

873 views

Published on

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

  • Be the first to comment

  • Be the first to like this

DUUG meetup Colours - Typescript

  1. 1. TYPESCRIPT DUUG 25 SEPTEMBER 2014 4F )F1)F '1**-/FžF F3+ -/F¥F´%)1# '1**-/
  2. 2. TYPESCRIPT LETS YOU WRITE JAVASCRIPT THE WAY YOU REALLY WANT TO.
  3. 3. TYPESCRIPT 4+ . )/ -! . '.. . *0' . 0)/$*). ) -$.
  4. 4. JAVASCRIPT TYPESCRIPT IS A TYPED SUPERSET OF JAVASCRIPT THAT COMPILES TO PLAIN JAVASCRIPT.
  5. 5. BENEFITS *(+$' - 4+ F.! /4 0/*F*(+' /$*) '-/$*)F!$' .F¨ F
  6. 6. $)F © )0'-‡%.F )
  7. 7. TYPES /-$) 0( - **' ) --4 )0( )4 *$
  8. 8. STRING / NUMBER / BOOLEAN var name: string = 'Jan'; var age: number = 24; var isDutch: boolean = true; name = isDutch; ))*/F*)1 -/FÞ**' )ÞF/*FÞ./-$)އ
  9. 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. 10. ENUM enum Countries { 'Netherlands', 'Belgium', 'Unkown' } var country: Countries = Countries.Netherlands;
  11. 11. ANY var notSure: any = 4; notSure = maybe a string instead; notSure = false; // okay, definitely a boolean
  12. 12. INTERFACES interface IPerson { Name: string; Country: Countries; IsDutch: boolean; callName(): string; }
  13. 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. 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. 15. CLASSES - A SHORTER WAY class person implements IPerson { constructor(public Name: string, public Country: Countries, public IsDutch: boolean) { } callName() { return this.Name; } }
  16. 16. NEW CLASS var dave = new person('Dave Woestenborghs', Countries.Belgium, false);
  17. 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. 18. TOOLS $.0'F/0$*FustvF0+/ Fu $.0'F/0$*FustuF¨ F
  19. 19. $)F © 0'$( F 3/F¨ F
  20. 20. $)F © (.F¨ F
  21. 21. $)F © $(F¨ F
  22. 22. $)F ©
  23. 23. DEMO

×