180 likes | 269 Views
Introduction to TypeScript. Michael Chu. Agenda. JavaScript. Features. Declarations. 1. 2. 3. 4. 5. 6. Alternatives. Tooling. Resources. JavaScript. 1995 20 years ago. Dynamic computer programming language. Brendan Eich Netscape Communica ., Mozilla Foundation.
E N D
Introduction to TypeScript Michael Chu
Agenda JavaScript Features Declarations 1 2 3 4 5 6 Alternatives Tooling Resources
JavaScript 1995 20 years ago Dynamic computer programming language Brendan Eich Netscape Communica., Mozilla Foundation Client side Server side (Node.js) Single Page App
Demo JavaScript
Application scale JavaScript development is hard • not design as a programming language for big application • does not have static typing • lack structuring mechanisms like classes, modules, interfaces
Expert “JavaScript is the assembly language of the Web.” Erik Meijer (software architect)
Expert “You can write large programs in JavaScript. You just can’t maintain them.” Anders Hejlsberg (father of C#)
The Alternatives • Hard core JavaScript development • JavaScript preprocessors that compiles to JavaScript: S# CoffeeScript coffeescript.org custom lang. Clojurescript github.com custom lang. Script# github.com C# Dart http://dartlang.org custom lang. by Google
TypeScript • TypeScriptis a typed superset of JavaScript that compiles to plain JavaScript. • TypeScript is a language for application scale JavaScript development. • Any browser. Any host. Any OS. • Open Source. • ~typescriptlang.org JS TS JS Copy JS code Compile to JavaScript Into TS file
TypeScript Key Features • Support standard JavaScript code with static typing • Zero cost: Static types completely disappear at run-time • Encapsulation though classes, modules and interfaces • Constructors, properties and functions (public, private) • Enums • Lambda and generics support • Intellisense and syntax checking • IDE support • Visual Studio • Sublime Text, Vi, Emacs • Eclipse, WebStorm • Preview Pane – Web Essentials
Demos TypeScript
Highlights Tool Features TypeScript Code • Type Annotation • Any and Primitive Type • Interface, Implementation • Class, constructor • Opt. Parameter, overloads • Event handler • Get accessor, private, static • Arrow function, lambda • Module • Typed definitions • And more… • Type Inference • Intellisense, statement comp. • Compile on Save • Preview Pane • ECMAScript version • Redirect JavaScript output • Generate declaration files
TypeScript Versions • TypeScript 1.3 for VS older (Web Essentials) • TypeScript 1.3 for VS 2013 Update 2 • TypeScript 1.4 for VS 2013 • TypeScript 1.4 for VS 2015 CTP5 • TypeScript 2.0 (vNext)
Resources • http://www.typescriptlang.org • http://www.typescriptlang.org/Content/TypeScript%20Language%20Specification.pdf • http://www.typescriptlang.org/Playground • http://vswebessentials.com/download • https://github.com/borisyankov/DefinitelyTyped • https://github.com/Microsoft/TypeScript
Angular 2: Built on TypeScript • http://blogs.msdn.com/b/typescript/archive/2015/03/05/angular-2-0-built-on-typescript.aspx • http://blogs.msdn.com/b/visualstudio/archive/2015/03/12/a-preview-of-angular-2-and-typescript-in-visual-studio.aspx
Summary • Open source language that compiles into JavaScript • Code encapsulation • Maintainable code • Tooling support Application scale JavaScript development is hard TypeScript makes it easier