Typescript overview

100 %
0 %
Information about Typescript overview
Technology

Published on March 10, 2014

Author: codeblock

Source: slideshare.net

Description

Slides presented during the Community LAB (Typescript in the real world)

Andrea Boschin http://1drv.ms/1flJCDT Typescript overview

Javascript why?

Javascript any browser any host any os

Javascript hard to learn hard to read hard to maintain

Javascript type unsafe prone to tricks non-scoped

Typescript starts with Javascript, ends with Javascript è un superset tipizzato di Javascript quindi il codice Javascript è già Typescript (on steroids)

Typescript starts with Javascript, ends with Javascript produce Javascript quindi any browser, any host, any os!

Typescript static type checking var a: string = 'Andrea'; var b: number = 10; var c: number = a + b; Cannot convert ‘string’ to ‘number’

Typescript structural typing var speaker: { firstName: string; lastName: string; }; speaker = { firstName: 'Andrea', lastName: 'Boschin' }; Declares a type inline

Typescript interfaces interface IPerson { firstName: string; lastName: string; birthDate: Date; } var developer: IPerson = { firstName: 'Andrea', lastName: 'Boschin', birthDate: new Date(1968, 10, 27) }; Declares an interface

Javascript Interface output var developer = { firstName: 'Andrea', lastName: 'Boschin', birthDate: new Date(1968, 10, 27) };

Typescript classes class Person { firstName: string; lastName: string; birthDate: Date; getAge(): number { return new Date().getFullYear() - this.birthDate.getFullYear(); } } var speaker: Person = new Person(); speaker.firstName = 'Andrea'; speaker.lastName = 'Boschin'; speaker.birthDate = new Date(1968, 10, 27); console.log(speaker.getAge());

Javascript class output var Person = (function () { function Person() { } Person.prototype.getAge = function () { return new Date().getFullYear() - this.birthDate.getFullYear(); }; return Person; })(); var speaker = new Person(); speaker.firstName = 'Andrea'; speaker.lastName = 'Boschin'; speaker.birthDate = new Date(1968, 10, 27); console.log(speaker.getAge());

Typescript modules module model { export class Person { /* person implementation */ } export module collections { export class PersonList { /* collection implementation */ } } } var me: model.Person = new model.Person(); var people: model.collections.PersonList = new model.collections.PersonList();

Typescript callbacks class Service { public getItems(success: (result: any[]) => void): void { success(["a", "b", "c"]); } } function(result: any[]): void {}

Typescript external libs definition files https://github.com/borisyankov/DefinitelyTyped jquery angular knockout .d.ts .d.ts .d.ts

Typescript memo VS debugger works! (thanks to «sourcemaps») Typescript compiler is developed with Typescript Compiler can be hosted in ECMASCRIPT 3 browsers

Typescript why  support for ECMAScript 6 in ECMAScript 3 browsers  open Source and available to download on codeplex  tooling support, for type safety, inference and refactoring  static types and compilation catches mistakes earlier  structural interfaces & typing  works well with existing projects Anders Hejlsberg is involved. enables programming in the large

Typescript toolset http://www.typescriptlang.org visual studio 2012/2013 plugin available visual studio 2013 - update 2 - Feb 25 integrated other IDE? Sublime Text, EMACS, Vim

LAB

feedback 10 o feedback su: • http://xedotnet.org/feedback • MAIL andrea@boschin.it • TWITTER http://twitter.com/aboschin • FACEBOOK http://www.facebook.com/thesmallgrove ANDREA BOSCHIN Most Valuable Professional

Prossimo Meeting 11 aprile 2014 – Virtual Meeting 21:00 – Pragmatic Javascript Speaker: D.Morosinotto Un viaggio nel "mondo Javascript": partendo dalle basi (tipi di dati, oggetti literal, array associativi, prototype e this...) vedremo come sia possibile implementare dei Pattern OOP (Closure, Revealing Modulo, Mixin...) Forse scopriremo che JS può fare qualcosa di più che gestire qualche click e modificare degli elementi del DOM con JQuery, a voi l'ardua sentenza...

Prossimo Meeting 4 aprile 2014 – Community Meeting: Visual Studio20:00 - Sviluppare applicazioni web (completamente) on-line con Visual Studio «Monaco» Speaker: M.Parenzan Windows Azure e Team Foundation Server hanno cominciato a cambiare in una maniera incredibile il modo di gestire i progetti software e tutta l'attività professionale dello sviluppatore. Ora il passaggio ulteriore: un Visual Studio che gira nel browser... 21:30 - Utilizzare Git con TFS Speaker: D.Vernole In questa sessione vedremo come sia possibile utilizzare GIT come repository dei sorgenti in TFS 2013 in alternativa a Visual Source Control

Add a comment

Related presentations

Presentación que realice en el Evento Nacional de Gobierno Abierto, realizado los ...

In this presentation we will describe our experience developing with a highly dyna...

Presentation to the LITA Forum 7th November 2014 Albuquerque, NM

Un recorrido por los cambios que nos generará el wearabletech en el futuro

Um paralelo entre as novidades & mercado em Wearable Computing e Tecnologias Assis...

Microsoft finally joins the smartwatch and fitness tracker game by introducing the...

Related pages

TypeScript - JavaScript that scales.

With TypeScript, several of our team members have said things like 'I now actually understand most of our own code!' because they can easily traverse it ...
Read more

Architectural Overview · Microsoft/TypeScript Wiki · GitHub

Layer Overview. Core TypeScript Compiler. Parser: Starting from a set of sources, and following the productions of the language grammar, to generate an ...
Read more

What is TypeScript? Pros and Cons – Darlene Tate – Medium

What is TypeScript? Pros and Cons. JavaScript is far from the best-designed language and has a number of features and quirks that make it ...
Read more

TypeScript Overview (in English) - YouTube

Want to watch this again later? Sign in to add this video to a playlist. Lecture: TypeScript Overview (in English) Course: JavaScript OOP http ...
Read more

What is TypeScript and why would I use it in place of ...

What is TypeScript and why would I use it in place of JavaScript? ... The official website of TypeScript gives an overview of these features.
Read more

TypeScript Overview - YouTube

What is TypeScript, features it offers like static typing, ability to trans pile ES6+ into ES5 so it could run in current browsers, and much ...
Read more

TypeScript function overloading - Stack Overflow

Section 6.3 of the TypeScript language spec ... Tour Start here for a quick overview of the site ... TypeScript function overloading.
Read more

Anders Hejlsberg: Introducing TypeScript | Channel 9

TypeScript is a programming language that makes it easier to write cross-platform, application scale, JavaScript that runs in any browser or in any host.
Read more

Quick start · TypeScript

Quick start. Let’s get started by building a simple web application with TypeScript. Installing TypeScript. There are two main ways to get the TypeScript ...
Read more