SlideShare une entreprise Scribd logo
1  sur  27
Télécharger pour lire hors ligne
Typescript
Topics Today
● What is Typescript ?
● Installation
● Demo Session
● Typescript Benefits
What is
Typescript ?
TypeScript: JavaScript that scales
A statically typed superset
of JavaScript that compiles
to plain JavaScript
Any browser.
Any host.
Any OS.
Open Source.
The feature gap
Javascript
Evolution
ES3 ES5
ES
2015
ES
2016
ES
2017
ES
2018
ES
2019
State of the
art JS
State of
Server JS
State of
Web JS
2015
JavaScript feature gapTarget Productivity
The feature gap
Javascript
Evolution
ES3 ES5
ES
2015
ES
2016
ES
2017
ES
2018
ES
2019
State of the
art JS
State of
Server JS
State of
Web JS
2016
Target ProductivityJavaScript feature gap
Installation
npm install -g typescript
tsc helloworld.ts
npm install -g typings
Typescript
Benefits
Object
Oriented
programming
.Net Developers
Large teams and applications
Switch between
es5 and es6
The TypeScript
Definition
Manager
New features
EcmaScript 2015 support
tsconfig.json files
TS Server language service
Decorators
Local types
Generic type aliases
User defined type guard functions
JSX support
Intersection types
Abstract classes and methods
ES2016 exponentiation operator
Polymorphic this type
Async/await
this-based type guards
Improved checking of for-in statements
Reachability analysis
Checking of destructuring with literal
initializers
JavaScript in TypeScript compilations
String literal types
Sateless function components in JSX
Support for F-bounded polymorphism
JSDoc support in JavaScript files
Support for default import interop with
SystemJS
Recognize constructor functions in
JavaScript files
Module augmentations
Support for custom JSX factories
Non-nullable types
0 1 2 42 0.25
‘a’, ‘b’, ‘hello’
true or false
number
string
boolean
undefined
undefined
null
null
Non-nullable types
Union types
0 1 2 42 0.25
number
‘a’, ‘b’, ‘hello’
string
null
null
number | string | null
“We love TypeScript for many things… 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. And
we’ve found several bugs via TypeScript’s checks.”
— Brad Green, Engineering Director - AngularJS
“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 - Ionic
Questions

Contenu connexe

Tendances

Tendances (20)

Introducing type script
Introducing type scriptIntroducing type script
Introducing type script
 
TypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret WeaponTypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret Weapon
 
Introduction to Angular for .NET Developers
Introduction to Angular for .NET DevelopersIntroduction to Angular for .NET Developers
Introduction to Angular for .NET Developers
 
Typescript ppt
Typescript pptTypescript ppt
Typescript ppt
 
TypeScript intro
TypeScript introTypeScript intro
TypeScript intro
 
Typescript in 30mins
Typescript in 30mins Typescript in 30mins
Typescript in 30mins
 
Introduction to Angular for .NET Developers
Introduction to Angular for .NET DevelopersIntroduction to Angular for .NET Developers
Introduction to Angular for .NET Developers
 
TypeScript - An Introduction
TypeScript - An IntroductionTypeScript - An Introduction
TypeScript - An Introduction
 
Getting started with typescript
Getting started with typescriptGetting started with typescript
Getting started with typescript
 
Typescript Fundamentals
Typescript FundamentalsTypescript Fundamentals
Typescript Fundamentals
 
Introduction about type script
Introduction about type scriptIntroduction about type script
Introduction about type script
 
TypeScript . the JavaScript developer best friend!
TypeScript . the JavaScript developer best friend!TypeScript . the JavaScript developer best friend!
TypeScript . the JavaScript developer best friend!
 
Introduction to Angular for .NET Developers
Introduction to Angular for .NET DevelopersIntroduction to Angular for .NET Developers
Introduction to Angular for .NET Developers
 
TypeScript: coding JavaScript without the pain
TypeScript: coding JavaScript without the painTypeScript: coding JavaScript without the pain
TypeScript: coding JavaScript without the pain
 
Debugging an Angular App
Debugging an Angular AppDebugging an Angular App
Debugging an Angular App
 
TypeScript - Silver Bullet for the Full-stack Developers
TypeScript - Silver Bullet for the Full-stack DevelopersTypeScript - Silver Bullet for the Full-stack Developers
TypeScript - Silver Bullet for the Full-stack Developers
 
Learning typescript
Learning typescriptLearning typescript
Learning typescript
 
Getting Started with TypeScript
Getting Started with TypeScriptGetting Started with TypeScript
Getting Started with TypeScript
 
TypeScript 2 in action
TypeScript 2 in actionTypeScript 2 in action
TypeScript 2 in action
 
TypeScript Best Practices
TypeScript Best PracticesTypeScript Best Practices
TypeScript Best Practices
 

En vedette (7)

TypeScript Introduction
TypeScript IntroductionTypeScript Introduction
TypeScript Introduction
 
Building End to-End Web Apps Using TypeScript
Building End to-End Web Apps Using TypeScriptBuilding End to-End Web Apps Using TypeScript
Building End to-End Web Apps Using TypeScript
 
Introduction to Type Script by Sam Goldman, SmartLogic
Introduction to Type Script by Sam Goldman, SmartLogicIntroduction to Type Script by Sam Goldman, SmartLogic
Introduction to Type Script by Sam Goldman, SmartLogic
 
Type script
Type scriptType script
Type script
 
Introduction to Angular with TypeScript for .NET Developers
Introduction to Angular with TypeScript for .NET DevelopersIntroduction to Angular with TypeScript for .NET Developers
Introduction to Angular with TypeScript for .NET Developers
 
Introduction to TypeScript
Introduction to TypeScriptIntroduction to TypeScript
Introduction to TypeScript
 
Getting started with typescript and angular 2
Getting started with typescript  and angular 2Getting started with typescript  and angular 2
Getting started with typescript and angular 2
 

Similaire à Typescript - MentorMate Academy

Similaire à Typescript - MentorMate Academy (20)

TypeScript VS JavaScript.pptx
TypeScript VS JavaScript.pptxTypeScript VS JavaScript.pptx
TypeScript VS JavaScript.pptx
 
Benefits of Typescript.pptx
Benefits of Typescript.pptxBenefits of Typescript.pptx
Benefits of Typescript.pptx
 
Typescript overview
Typescript overviewTypescript overview
Typescript overview
 
Type script
Type scriptType script
Type script
 
Type script = javascript (alomst) done right
Type script = javascript (alomst) done rightType script = javascript (alomst) done right
Type script = javascript (alomst) done right
 
Java script anywhere. What Nombas was doing pre-acquisition.
Java script anywhere. What Nombas was doing pre-acquisition.Java script anywhere. What Nombas was doing pre-acquisition.
Java script anywhere. What Nombas was doing pre-acquisition.
 
Organisation of professional JavaScript Projects
Organisation of professional JavaScript ProjectsOrganisation of professional JavaScript Projects
Organisation of professional JavaScript Projects
 
SPUnite17 TypeScript for SharePoint Developers
SPUnite17 TypeScript for SharePoint DevelopersSPUnite17 TypeScript for SharePoint Developers
SPUnite17 TypeScript for SharePoint Developers
 
Scala's evolving ecosystem- Introduction to Scala.js
Scala's evolving ecosystem- Introduction to Scala.jsScala's evolving ecosystem- Introduction to Scala.js
Scala's evolving ecosystem- Introduction to Scala.js
 
TypeScript
TypeScriptTypeScript
TypeScript
 
TypeScript
TypeScriptTypeScript
TypeScript
 
What's New in ASP.NET Core 3
What's New in ASP.NET Core 3What's New in ASP.NET Core 3
What's New in ASP.NET Core 3
 
Type script vs javascript come face to face in battleground
Type script vs javascript come face to face in battlegroundType script vs javascript come face to face in battleground
Type script vs javascript come face to face in battleground
 
Java 8 - Gateway Drug or End of Line?
Java 8 - Gateway Drug or End of Line?Java 8 - Gateway Drug or End of Line?
Java 8 - Gateway Drug or End of Line?
 
Modern java script features
Modern java script featuresModern java script features
Modern java script features
 
Next-generation JavaScript - OpenSlava 2014
Next-generation JavaScript - OpenSlava 2014Next-generation JavaScript - OpenSlava 2014
Next-generation JavaScript - OpenSlava 2014
 
JavaOne 2014 - Scalable JavaScript Applications with Project Nashorn [CON6423]
JavaOne 2014 - Scalable JavaScript Applications with Project Nashorn [CON6423]JavaOne 2014 - Scalable JavaScript Applications with Project Nashorn [CON6423]
JavaOne 2014 - Scalable JavaScript Applications with Project Nashorn [CON6423]
 
Criando API Nodejs com TypeScript
Criando API Nodejs com TypeScriptCriando API Nodejs com TypeScript
Criando API Nodejs com TypeScript
 
Building End to-End Web Apps Using TypeScript
Building End to-End Web Apps Using TypeScriptBuilding End to-End Web Apps Using TypeScript
Building End to-End Web Apps Using TypeScript
 
TypeScript With Node And Express
TypeScript With Node And ExpressTypeScript With Node And Express
TypeScript With Node And Express
 

Plus de Dimitar Danailov

Plus de Dimitar Danailov (20)

Evolution - ReConnect() 2019
Evolution - ReConnect() 2019Evolution - ReConnect() 2019
Evolution - ReConnect() 2019
 
Data Visualization and D3Js
Data Visualization and D3JsData Visualization and D3Js
Data Visualization and D3Js
 
#Productivity - {S:01 Ep:03}
#Productivity - {S:01 Ep:03} #Productivity - {S:01 Ep:03}
#Productivity - {S:01 Ep:03}
 
#Productivity - {S:01 Ep:02}
#Productivity - {S:01 Ep:02}#Productivity - {S:01 Ep:02}
#Productivity - {S:01 Ep:02}
 
#Productivity s01 ep02
#Productivity s01 ep02#Productivity s01 ep02
#Productivity s01 ep02
 
#Productivity s01 ep01
#Productivity s01 ep01#Productivity s01 ep01
#Productivity s01 ep01
 
Cloud Conf Varna - Cloud Application with AWS Lambda functions
Cloud Conf Varna - Cloud Application with AWS Lambda functionsCloud Conf Varna - Cloud Application with AWS Lambda functions
Cloud Conf Varna - Cloud Application with AWS Lambda functions
 
DEV.BG - Angular 1 and Jasmine (Unit Testing and TDD)
DEV.BG - Angular 1 and Jasmine (Unit Testing and TDD)DEV.BG - Angular 1 and Jasmine (Unit Testing and TDD)
DEV.BG - Angular 1 and Jasmine (Unit Testing and TDD)
 
Building modern Progressive Web Apps with Polymer
Building modern Progressive Web Apps with PolymerBuilding modern Progressive Web Apps with Polymer
Building modern Progressive Web Apps with Polymer
 
HackConf2016 - Ruby on Rails: Unexpected journey
HackConf2016 - Ruby on Rails: Unexpected journeyHackConf2016 - Ruby on Rails: Unexpected journey
HackConf2016 - Ruby on Rails: Unexpected journey
 
Microservices - Code Voyagers Sofia
Microservices - Code Voyagers SofiaMicroservices - Code Voyagers Sofia
Microservices - Code Voyagers Sofia
 
Mongo DB Terms - Mentormate Academy
Mongo DB Terms - Mentormate AcademyMongo DB Terms - Mentormate Academy
Mongo DB Terms - Mentormate Academy
 
Startup Europe Week - Cloud Conf Varna & GDG Varna
Startup Europe Week - Cloud Conf Varna & GDG VarnaStartup Europe Week - Cloud Conf Varna & GDG Varna
Startup Europe Week - Cloud Conf Varna & GDG Varna
 
GDG Varna - Hadoop
GDG Varna - HadoopGDG Varna - Hadoop
GDG Varna - Hadoop
 
MicroServices: Advantages ans Disadvantages
MicroServices: Advantages ans DisadvantagesMicroServices: Advantages ans Disadvantages
MicroServices: Advantages ans Disadvantages
 
GDG Varna - EcmaScript 6
GDG Varna - EcmaScript 6GDG Varna - EcmaScript 6
GDG Varna - EcmaScript 6
 
Softuni.bg - Microservices
Softuni.bg - MicroservicesSoftuni.bg - Microservices
Softuni.bg - Microservices
 
Cloud Conf Varna: Vagrant and Amazon
Cloud Conf Varna: Vagrant and AmazonCloud Conf Varna: Vagrant and Amazon
Cloud Conf Varna: Vagrant and Amazon
 
HackConf2015 - Ruby on Rails: Unexpected journey
HackConf2015 - Ruby on Rails: Unexpected journeyHackConf2015 - Ruby on Rails: Unexpected journey
HackConf2015 - Ruby on Rails: Unexpected journey
 
Lighting talks - Microservices
Lighting talks - MicroservicesLighting talks - Microservices
Lighting talks - Microservices
 

Dernier

introduction-to-automotive Andoid os-csimmonds-ndctechtown-2021.pdf
introduction-to-automotive Andoid os-csimmonds-ndctechtown-2021.pdfintroduction-to-automotive Andoid os-csimmonds-ndctechtown-2021.pdf
introduction-to-automotive Andoid os-csimmonds-ndctechtown-2021.pdf
VishalKumarJha10
 
TECUNIQUE: Success Stories: IT Service provider
TECUNIQUE: Success Stories: IT Service providerTECUNIQUE: Success Stories: IT Service provider
TECUNIQUE: Success Stories: IT Service provider
mohitmore19
 

Dernier (20)

introduction-to-automotive Andoid os-csimmonds-ndctechtown-2021.pdf
introduction-to-automotive Andoid os-csimmonds-ndctechtown-2021.pdfintroduction-to-automotive Andoid os-csimmonds-ndctechtown-2021.pdf
introduction-to-automotive Andoid os-csimmonds-ndctechtown-2021.pdf
 
Unlocking the Future of AI Agents with Large Language Models
Unlocking the Future of AI Agents with Large Language ModelsUnlocking the Future of AI Agents with Large Language Models
Unlocking the Future of AI Agents with Large Language Models
 
Azure_Native_Qumulo_High_Performance_Compute_Benchmarks.pdf
Azure_Native_Qumulo_High_Performance_Compute_Benchmarks.pdfAzure_Native_Qumulo_High_Performance_Compute_Benchmarks.pdf
Azure_Native_Qumulo_High_Performance_Compute_Benchmarks.pdf
 
Shapes for Sharing between Graph Data Spaces - and Epistemic Querying of RDF-...
Shapes for Sharing between Graph Data Spaces - and Epistemic Querying of RDF-...Shapes for Sharing between Graph Data Spaces - and Epistemic Querying of RDF-...
Shapes for Sharing between Graph Data Spaces - and Epistemic Querying of RDF-...
 
Exploring the Best Video Editing App.pdf
Exploring the Best Video Editing App.pdfExploring the Best Video Editing App.pdf
Exploring the Best Video Editing App.pdf
 
HR Software Buyers Guide in 2024 - HRSoftware.com
HR Software Buyers Guide in 2024 - HRSoftware.comHR Software Buyers Guide in 2024 - HRSoftware.com
HR Software Buyers Guide in 2024 - HRSoftware.com
 
Tech Tuesday-Harness the Power of Effective Resource Planning with OnePlan’s ...
Tech Tuesday-Harness the Power of Effective Resource Planning with OnePlan’s ...Tech Tuesday-Harness the Power of Effective Resource Planning with OnePlan’s ...
Tech Tuesday-Harness the Power of Effective Resource Planning with OnePlan’s ...
 
call girls in Vaishali (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝✔️✔️
call girls in Vaishali (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝✔️✔️call girls in Vaishali (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝✔️✔️
call girls in Vaishali (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝✔️✔️
 
Optimizing AI for immediate response in Smart CCTV
Optimizing AI for immediate response in Smart CCTVOptimizing AI for immediate response in Smart CCTV
Optimizing AI for immediate response in Smart CCTV
 
Microsoft AI Transformation Partner Playbook.pdf
Microsoft AI Transformation Partner Playbook.pdfMicrosoft AI Transformation Partner Playbook.pdf
Microsoft AI Transformation Partner Playbook.pdf
 
Direct Style Effect Systems - The Print[A] Example - A Comprehension Aid
Direct Style Effect Systems -The Print[A] Example- A Comprehension AidDirect Style Effect Systems -The Print[A] Example- A Comprehension Aid
Direct Style Effect Systems - The Print[A] Example - A Comprehension Aid
 
A Secure and Reliable Document Management System is Essential.docx
A Secure and Reliable Document Management System is Essential.docxA Secure and Reliable Document Management System is Essential.docx
A Secure and Reliable Document Management System is Essential.docx
 
TECUNIQUE: Success Stories: IT Service provider
TECUNIQUE: Success Stories: IT Service providerTECUNIQUE: Success Stories: IT Service provider
TECUNIQUE: Success Stories: IT Service provider
 
call girls in Vaishali (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝✔️✔️
call girls in Vaishali (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝✔️✔️call girls in Vaishali (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝✔️✔️
call girls in Vaishali (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝✔️✔️
 
How To Troubleshoot Collaboration Apps for the Modern Connected Worker
How To Troubleshoot Collaboration Apps for the Modern Connected WorkerHow To Troubleshoot Collaboration Apps for the Modern Connected Worker
How To Troubleshoot Collaboration Apps for the Modern Connected Worker
 
Reassessing the Bedrock of Clinical Function Models: An Examination of Large ...
Reassessing the Bedrock of Clinical Function Models: An Examination of Large ...Reassessing the Bedrock of Clinical Function Models: An Examination of Large ...
Reassessing the Bedrock of Clinical Function Models: An Examination of Large ...
 
W01_panagenda_Navigating-the-Future-with-The-Hitchhikers-Guide-to-Notes-and-D...
W01_panagenda_Navigating-the-Future-with-The-Hitchhikers-Guide-to-Notes-and-D...W01_panagenda_Navigating-the-Future-with-The-Hitchhikers-Guide-to-Notes-and-D...
W01_panagenda_Navigating-the-Future-with-The-Hitchhikers-Guide-to-Notes-and-D...
 
Right Money Management App For Your Financial Goals
Right Money Management App For Your Financial GoalsRight Money Management App For Your Financial Goals
Right Money Management App For Your Financial Goals
 
AI & Machine Learning Presentation Template
AI & Machine Learning Presentation TemplateAI & Machine Learning Presentation Template
AI & Machine Learning Presentation Template
 
Vip Call Girls Noida ➡️ Delhi ➡️ 9999965857 No Advance 24HRS Live
Vip Call Girls Noida ➡️ Delhi ➡️ 9999965857 No Advance 24HRS LiveVip Call Girls Noida ➡️ Delhi ➡️ 9999965857 No Advance 24HRS Live
Vip Call Girls Noida ➡️ Delhi ➡️ 9999965857 No Advance 24HRS Live
 

Typescript - MentorMate Academy

  • 2. Topics Today ● What is Typescript ? ● Installation ● Demo Session ● Typescript Benefits
  • 5. A statically typed superset of JavaScript that compiles to plain JavaScript
  • 6. Any browser. Any host. Any OS. Open Source.
  • 7. The feature gap Javascript Evolution ES3 ES5 ES 2015 ES 2016 ES 2017 ES 2018 ES 2019 State of the art JS State of Server JS State of Web JS 2015 JavaScript feature gapTarget Productivity
  • 8. The feature gap Javascript Evolution ES3 ES5 ES 2015 ES 2016 ES 2017 ES 2018 ES 2019 State of the art JS State of Server JS State of Web JS 2016 Target ProductivityJavaScript feature gap
  • 10. npm install -g typescript
  • 12. npm install -g typings
  • 13.
  • 16.
  • 18. Large teams and applications
  • 21.
  • 22. New features EcmaScript 2015 support tsconfig.json files TS Server language service Decorators Local types Generic type aliases User defined type guard functions JSX support Intersection types Abstract classes and methods ES2016 exponentiation operator Polymorphic this type Async/await this-based type guards Improved checking of for-in statements Reachability analysis Checking of destructuring with literal initializers JavaScript in TypeScript compilations String literal types Sateless function components in JSX Support for F-bounded polymorphism JSDoc support in JavaScript files Support for default import interop with SystemJS Recognize constructor functions in JavaScript files Module augmentations Support for custom JSX factories Non-nullable types
  • 23. 0 1 2 42 0.25 ‘a’, ‘b’, ‘hello’ true or false number string boolean undefined undefined null null Non-nullable types
  • 24. Union types 0 1 2 42 0.25 number ‘a’, ‘b’, ‘hello’ string null null number | string | null
  • 25. “We love TypeScript for many things… 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. And we’ve found several bugs via TypeScript’s checks.” — Brad Green, Engineering Director - AngularJS
  • 26. “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 - Ionic