What’s New in TypeScript? - PowerPoint Presentation

Slide1
Slide2

What’s New in TypeScript?

Anders HejlsbergTechnical Fellow

B881Slide3

TypeScript: JavaScript that scales.Slide4

A statically typed superset of JavaScript

that compiles to plain JavaScript.Slide5

Any browser. Any host. Any OS.Slide6

Open Source.Slide7

Great tools enabled

by static types

Features from the

future, today!Slide8

The feature gap

State

of

the

art

JS

State of

server JS

State

of

web JS

JavaScript feature gap

Target

Productivity

JavaScript

Evolution

ES3

ES5

ES2016

ES2017

ES2018

ES2015

March 2015

March 2016Slide9

DemoSlide10

One year, four releases

1.5

1.6

1.7

1.8

Core ES2015 +

Decorators

Full

ES2015 +

React/JSX

Async/await

on server +

polymorphic

‘this’ types

JavaScript in

TS projects +

control flow

analysisSlide11

New f

eatures

ECMAScript 2015 support

tsconfig.json

files

TS Server language service

Decorators

Local

types

Generic type aliases

User defined type guard functionsJSX supportIntersection typesAbstract classes and methods

ES2016

exponentation

operator

Polymorphic

this typeAsync/await

Reachability analysis

Checking of

destructuring with literal initializersJavaScript in TypeScript compilationsString literal typesStateless Functional Components in JSX

Support for

F-bounded polymorphism

JSDoc support in JavaScript filesSupport for default import interop with SystemJSRecognize constructor functions in JavaScript filesModule augmentationsthis-based type guardsSupport for custom JSX factories Improved checking of for-in statementsSlide12

DemoSlide13

TypeScript roadmap

TypeScript 2.0Non-

nullable

types

Control flow based type analysis

Async/await

downlevel

support

Readonly

properties

Declared ‘this’ type in functionsImproved typings acquisitionTypeScript 2.1 and beyondNew JS language service in Visual StudioMore refactoring supportImproved support for ‘this’ in functionsAnd much more…Slide14

Nullable types

0

1

2

42

0.25

…

null

undefined

number

'a'

''

'b'

'hello'

'42'

…

null

undefined

string

true

false

null

undefined

booleanSlide15

Nullable types

0

1

2

42

0.25

…

null

undefined

number

'a'

''

'b'

'hello'

'42'

…

null

undefined

string

true

false

null

undefined

boolean

number | stringSlide16

Nullable types

0

1

2

42

0.25

…

null

undefined

number

'a'

''

'b'

'hello'

'42'

…

null

undefined

string

true

false

null

undefined

booleanSlide17

Non-nullable

types

0

1

2

42

0.25

…

null

undefined

number

'a'

''

'b'

'hello'

'42'

…

null

undefined

string

true

false

null

undefined

booleanSlide18

Non-nullable

types

0

1

2

42

0.25

…

number

'a'

''

'b'

'hello'

'42'

…

string

true

false

boolean

undefined

undefined

null

nullSlide19

Non-nullable

types

0

1

2

42

0.25

…

number

undefined

undefined

number | undefinedSlide20

Non-nullable

types

'a'

''

'b'

'hello'

'42'

…

string

undefined

undefined

null

null

string | null | undefinedSlide21

DemoSlide22

Non-nullable

and control flow based types

New --

strictNullChecks

compiler flag

Definite assignment analysis

Control flow reflected in types of local variables

Non-null and non-undefined type guards

Dotted names in type guards

Non-null assertion operator (postfix ‘!’)

Backwards compatibilityGitHub pull request #7140Slide23

Improved typings

acquisition

Uses NPM to install “type declaration packages”

For example “

npm

install @types/

jquery

”

NPM automatically handles dependencies

Automatic publishing from

DefinitelyTyped on GitHubNew “Universal Module Declarations” (pull request #7264)New /// <reference types="jquery"/> directiveNew “types” property in tsconfig.json

Version conflict detection for global

typingsSlide24

TypeScript tools

Visual Studio

Sublime Text

Atom

WebStorm

Visual Studio Code

Eclipse

Emacs

VimSlide25

TypeScript community

GitHub

3,800+ commits in the last year

1,200+ forks

10,000+ stars

Stack Overflow

8,000+ questions, up more than 2x in the last year

Definitely Typed

1,600+ .

d.ts

declaration files, up 2x in the last yearSlide26

TypeScript adoptionSlide27
Slide28

TypeScript and frameworks

“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 and understand relationships much better

.”

--

Brad Green, Engineering Director at Google

“One of

Ionic's

main goals is to make app development as quick and easy as possible, and the tooling support TypeScript gives us with

autocompletion

, type checking and source documentation really aligns with that

.”

--

Tim

Lancina

, Tooling Developer at Ionic

“TypeScript helped us to reuse the team’s knowledge and to keep the same team velocity by providing the same excellent developer experience as C# ... A huge improvement over plain JavaScript

.”

--

Valio

Stoychev

, PM Lead

NativeScript

“By combining Aurelia with TypeScript for modern web, mobile and desktop development, we've seen what is perhaps the most beautiful and elegant app development workflow to date

.”

--

Rob Eisenberg, Architect - Aurelia

“TypeScript has helped ensure that Dojo 2 will be built on rock solid foundations, which will make enterprise development better. TS gives us all the benefits of ES6, plus more productivity, … and responsive support from the TypeScript team ”

--

Dylan

Schiemann

, Co-founder - Dojo Toolkit, CEO -

SitePenSlide29

http://typescriptlang.orgSlide30

Please Complete An Evaluation Form

Your input is important

!

orSlide31