typescript: what to do with types in javascript

41
What to do with types in JavaScript about:TypeScript

Upload: vedran-marsic

Post on 10-May-2015

260 views

Category:

Software


0 download

DESCRIPTION

JavaScript is the assembly language of the web. There are languages that transcompile to JavaScript such as TypeScript, CoffeScript and many more. This is introduction to TypeScript with comparison CoffeScript and plain old JavaScript. It shows how to address some JavaScript specific challenges.

TRANSCRIPT

Page 1: TypeScript: What to do with types in JavaScript

What to do with types in JavaScript

about:TypeScript

Page 2: TypeScript: What to do with types in JavaScript

Who‘s talkin to you

• Vedran Maršić AKA Fosna

– dev at http://axilis.hr/

– organizing programming workshops for kids

• Logo, Scratch, HTML, CSS, JavaScript

Page 3: TypeScript: What to do with types in JavaScript

JavaScript is the assembly language of the web!

Author unknown, mentined at:

The Birth & Death of JavaScriptA talk by Gary Bernhardt from PyCon 2014 bit.ly/RtLaCe

Page 4: TypeScript: What to do with types in JavaScript

JavaScript alternatives

• CoffeScript

• Dart

• GWT

• Script#

• TypeScript• ...

Page 5: TypeScript: What to do with types in JavaScript

Folks rail against static typing but they don't complain about JSLint. TypeScript offers optional type annotations - it's hardly a

perversion of JavaScript.

Why does TypeScript have to be the answer to anything?

by Scott Hanselman

http://bit.ly/U1dHQR

Page 6: TypeScript: What to do with types in JavaScript

TypeScript overview

Super set of JavaScript

Optional static typing

Static type checking at compile time• smarter rename, refactor

• go to definition, declaration

• call hierarchy

Code sugar for classical OOP

Produces idiomatic JavaScript

Page 7: TypeScript: What to do with types in JavaScript

by Anders Hejlsburg

Original author of Turbo Pascal

Chief architect of Delphi

Lead architect of C#

Anounced in Oct 2012

v 1.0 in Apr 2014

Open Source @ http://typescript.codeplex.com/

Page 8: TypeScript: What to do with types in JavaScript

TypeScript trans(com)piler writen in TypeScript

Editor support:

Visual Studio 2012+,

SublimeText, Vi, Emacs, your favorite browser

http://www.typescriptlang.org/Playground

Page 9: TypeScript: What to do with types in JavaScript

TypeScript language features

classes, modules, function expressions

type annotations, type inference

interfaces, generics

enums

Page 10: TypeScript: What to do with types in JavaScript

Nicked with author approval. Thank you Vlad!

https://speakerdeck.com/vladiliescu/typescript-vs-coffeescript

Page 11: TypeScript: What to do with types in JavaScript
Page 12: TypeScript: What to do with types in JavaScript
Page 13: TypeScript: What to do with types in JavaScript

CLASSES, INHERITANCECode sugar for classical OOP

Page 14: TypeScript: What to do with types in JavaScript
Page 15: TypeScript: What to do with types in JavaScript
Page 16: TypeScript: What to do with types in JavaScript
Page 17: TypeScript: What to do with types in JavaScript
Page 18: TypeScript: What to do with types in JavaScript

MODULESPesky global scope management, actually.

Page 19: TypeScript: What to do with types in JavaScript
Page 20: TypeScript: What to do with types in JavaScript
Page 21: TypeScript: What to do with types in JavaScript

Going external

Page 22: TypeScript: What to do with types in JavaScript

FUNCTION EXPRESSIONS

Fix this. Like lambda expressions.

Page 23: TypeScript: What to do with types in JavaScript
Page 24: TypeScript: What to do with types in JavaScript
Page 25: TypeScript: What to do with types in JavaScript
Page 26: TypeScript: What to do with types in JavaScript

INTERFACESWith type annotations.

Page 27: TypeScript: What to do with types in JavaScript
Page 28: TypeScript: What to do with types in JavaScript

http://bit.ly/1oKVaox

Page 29: TypeScript: What to do with types in JavaScript

What impressed me the most is what TypeScript doesn’t do. It doesn’t output type checking into your JavaScript code.

Thoughts on TypeScript

by Nicholas C. Zakas

http://bit.ly/SkGe2y

Page 30: TypeScript: What to do with types in JavaScript

Type definition files

Like header files in C, C++

* JQuery declaration for demo. Real declarations are verbose.

Definitely Typed

https://github.com/borisyankov/DefinitelyTyped

Page 31: TypeScript: What to do with types in JavaScript

Of course, all valid Javascript is valid Typescript so you can just change the file extension and be compiling it but if you

want all the benefits you will want to take advantage of some type annotations and

that's the manual part.

Typescript - a real world story of adoption in TFS

by Brian Harry

http://bit.ly/SkGe2y

Page 32: TypeScript: What to do with types in JavaScript

COFFESCRIPT CLOSURE

CoffeScript has more code sugar to be fair.Check out if interested:CoffeScript the Good Parts

by Bruno Devićhttp://slides.com/brunodevic/coffeescript-the-good-parts

Page 33: TypeScript: What to do with types in JavaScript

DEMO

https://github.com/Fosna/TypeBoxes

Page 34: TypeScript: What to do with types in JavaScript

Object model

Page 35: TypeScript: What to do with types in JavaScript

FINAL THOUGHTSInteresting quotes

Page 36: TypeScript: What to do with types in JavaScript

Microsoft's TypeScript may be the best of the many JavaScript front ends. It seems to

generate the most attractive code.

post on Google+

by Douglas Crockford

bit.ly/SnJzw5

Page 37: TypeScript: What to do with types in JavaScript

And I think it should take pressure off of the ECMAScript Standard for new features like type declarations and classes. Anders

has shown that these can be provided nicely by a preprocessor, so there is no need to

change the underlying language.

same post on Google+

by Douglas Crockford

bit.ly/SnJzw5

Page 38: TypeScript: What to do with types in JavaScript

I think that JavaScript's loose typing is one of its best features and that type checking is way overrated. TypeScript adds sweetness, but at

a price. It is not a price I am willing to pay.

same post on Google+

by Douglas Crockford

bit.ly/SnJzw5

Page 39: TypeScript: What to do with types in JavaScript

TypeScript feature that suprised me the most, the quality of the JavaScript generated by the

TypeScript transcompiler and the transcompiler itself as a tool to learn JavaScript best

practices.

Learn TypeScript to Improve Your JavaScript

by Jaime González García

http://bit.ly/1ojyhVJ

Page 40: TypeScript: What to do with types in JavaScript

References

Spread throughout the presentation.

Page 41: TypeScript: What to do with types in JavaScript