SlideShare une entreprise Scribd logo
1  sur  52
Télécharger pour lire hors ligne
TypeScript
Hello!
I am Hiten Pratap Singh
I am here because I love to dive into new
interesting things.
You can find me at:
https://github.com/hitenpratap/
https://hprog99.wordpress.com/
hiten@nexthoughts.com
Agenda
▷ Introduction
▷ Installation
▷ Why TypeScript?
▷ Features
▷ Comparison With TypeScript Alternatives
▷ Who Uses TypeScript?
▷ Conclusion
1.
Introduction
JavaScript that scales.
“TypeScript lets you write JavaScript the way
you really want to.
TypeScript is a typed superset of JavaScript
that compiles to plain JavaScript.
Any browser. Any host. Any OS. Open Source.
Overview
▷ Syntax based on ECMAScript 4 &
ECMASCript 6 proposals
▷ TS is first and foremost a superset of JS
▷ Any regular Javascript is valid TypeScript
Code
“Microsoft's TypeScript may be the best of the
many JavaScript front ends. It seems to
generate the most attractive code.”
- Douglas Crockford
"CoffeeScript is to Ruby as TypeScript is to
Java/C#/C++."
- Luke Hoban
2.
Installation
How to get it setup?
How To Install
For more details check: https://www.typescriptlang.org/docs/tutorial.html
Via npm (the Node.js package manager)
By installing TypeScript’s Visual Studio plugins
Just download any appropriate Visual Studio from Microsoft site and you are all set to go.
You can also try Visual Studio Code IDE from https://code.visualstudio.com/ which is free, open
source and available for multi-platform.
3.
Why TypeScript?
Why everyone is using it more and more.
Main Goals of TypeScript
▷ Provide an optional type system for
JavaScript.
▷ Provide planned features from future
JavaScript editions to current JavaScript
engines
▷ Modular Development
4.
Features
What makes TypeScript super awesome
TypeScript Features
▷ Data Types Supported
▷ Optional Static Type Annotation
▷ Classes
▷ Interface
▷ Modules
▷ Arrow Expressions
▷ Type Assertions
▷ Ambient Declarations
▷ Source File Dependencies
Data Types
▷ Any
▷ Primitive
- Number
- Boolean
- String
- Void
- Null
- Undefined - Same as JS
▷ Array
▷ Enum
Any is used when it’s impossible to determine the type
Any
▷ Doesn’t have separate integers and float/double type. These all are
floating point values and get the type ‘number’
▷ boolean - true/false value
▷ string - both single/double quote can be used
▷ No separate char type
▷ void - is used in function type returning nothing
▷ null and undefined - functions as usual
Primitive
Array
By default, enums begin numbering their members starting at 0. You can
change this by manually setting the value of one its members.
Enum
Optional Types
Type Annotations/Checking
JavaScript
TypeScript
Type Inference
▷ TypeScript tries to infer types
▷ Four ways to variable declaration -
- Type and Value in one statement
- Type but no Value then Value will be undefined
- Value but on Type then the it will be of Any type but maybe be
inferred based on its value.
- Neither Value nor Type then Type will be Any and Value will
be undefined.
Classes
▷ Can implement interfaces
▷ Inheritance
▷ Instance methods/members
▷ Static methods/members
▷ Single constructor
▷ Default/Optional parameter
▷ ES6 class syntax
TypeScript Classes
TypeScript Classes Example
Inheritances
▷ Declared using interface keyword
▷ Like other TS features it’s design time features i.e. no extra code
would be emitted to resultant JS file
▷ Errors being shown when interface signature and implementation
doesn’t match.
TypeScript Interfaces
TypeScript Interfaces
Example
Modules
▷ Modules can be defined using module keyword
▷ A module can contains sub-modules, class, enums or interfaces. But
can’t directly contains functions.
▷ Modules can be nested(sub-modules).
▷ Classes and Interfaces can be exposed using export keyword.
TypeScript Modules
TypeScript Modules Example
Arrow Expressions
▷ Implicit return
▷ No braces for single expression
▷ Part of ES6
▷ Lexically scoped this
▷ You don't need to keep typing function
▷ It lexically captures the meaning of arguments
Arrow Expressions
Arrow Expressions Example
Type Assertions
TypeScript's type assertion are purely you telling the
compiler that you know about the types better than it
does, and that it should not second guess you.
Type Assertions
Type Assertions Example
Ambient Declarations
A major design goal of TypeScript was to make it
possible for you to safely and easily use existing
JavaScript libraries in TypeScript. TypeScript does this
by means of declaration.
Ambient Declarations
Source File Dependencies
▷ Can be done using reference keyword
▷ Must be the first statement of file
▷ Paths are relative to the current file
▷ Can also be done using tsconfig file
Source File Dependencies
Source File Dependencies Example
5.
Comparison with TS
Alternative
▷ Complete language + Runtime overhaul
▷ More features: generators, comprehensions, object literals etc
▷ Will take years before widely deployed
▷ No typing as of now(Maybe ES7)
TypeScript VS ES6 Harmony
▷ Also a superset to JavaScript
▷ More syntactic sugar, still dynamically typed
▷ Unlike TypeScript, JS is not valid CoffeeScript code
▷ It doesn’t track ECMAScript 6
TypeScript VS CoffeeScript
▷ Optionally typed
▷ A native VM
▷ Operator overloading
▷ ECMAScript Dart spec
▷ Completely different syntax and semantics than JS
TypeScript VS DART
6.
Who Uses TypeScript?
Companies use TypeScript
7.
Conclusion
Pros:
▷ High value, low cost improvement over JavaScript
▷ Safer and more modular
▷ Solid path to ECMAScript 6
Cons:
▷ Still need to know some JS quirks
▷ Current compiler slowish(Faster one is in development)
Conclusion
Thanks!
Any questions?
You can find me at:
https://github.com/hitenpratap/
https://hprog99.wordpress.com/
hiten@nexthoughts.com
References
▷ https://www.typescriptlang.org/docs/tutorial.html
▷ https://learnxinyminutes.com/docs/typescript/
▷ https://basarat.gitbooks.io/typescript/content/
▷ http://www.slideshare.net/SanderMak/typescript-coding-javascript-
without-the-pain
▷ http://www.slideshare.net/aniruddha.chakrabarti/typescript-44668095

Contenu connexe

Tendances

TypeScript: coding JavaScript without the pain
TypeScript: coding JavaScript without the painTypeScript: coding JavaScript without the pain
TypeScript: coding JavaScript without the painSander Mak (@Sander_Mak)
 
TypeScript Best Practices
TypeScript Best PracticesTypeScript Best Practices
TypeScript Best Practicesfelixbillon
 
Why TypeScript?
Why TypeScript?Why TypeScript?
Why TypeScript?FITC
 
TypeScript Introduction
TypeScript IntroductionTypeScript Introduction
TypeScript IntroductionDmitry Sheiko
 
Advanced Javascript
Advanced JavascriptAdvanced Javascript
Advanced JavascriptAdieu
 
Type script - advanced usage and practices
Type script  - advanced usage and practicesType script  - advanced usage and practices
Type script - advanced usage and practicesIwan van der Kleijn
 
Unit 1 - TypeScript & Introduction to Angular CLI.pptx
Unit 1 - TypeScript & Introduction to Angular CLI.pptxUnit 1 - TypeScript & Introduction to Angular CLI.pptx
Unit 1 - TypeScript & Introduction to Angular CLI.pptxMalla Reddy University
 
JavaScript - Chapter 9 - TypeConversion and Regular Expressions
 JavaScript - Chapter 9 - TypeConversion and Regular Expressions  JavaScript - Chapter 9 - TypeConversion and Regular Expressions
JavaScript - Chapter 9 - TypeConversion and Regular Expressions WebStackAcademy
 
Introduction to AngularJS
Introduction to AngularJSIntroduction to AngularJS
Introduction to AngularJSDavid Parsons
 
Angular Introduction By Surekha Gadkari
Angular Introduction By Surekha GadkariAngular Introduction By Surekha Gadkari
Angular Introduction By Surekha GadkariSurekha Gadkari
 
ES2015 / ES6: Basics of modern Javascript
ES2015 / ES6: Basics of modern JavascriptES2015 / ES6: Basics of modern Javascript
ES2015 / ES6: Basics of modern JavascriptWojciech Dzikowski
 

Tendances (20)

TypeScript: coding JavaScript without the pain
TypeScript: coding JavaScript without the painTypeScript: coding JavaScript without the pain
TypeScript: coding JavaScript without the pain
 
Getting started with typescript
Getting started with typescriptGetting started with typescript
Getting started with typescript
 
TypeScript Best Practices
TypeScript Best PracticesTypeScript Best Practices
TypeScript Best Practices
 
Why TypeScript?
Why TypeScript?Why TypeScript?
Why TypeScript?
 
TypeScript intro
TypeScript introTypeScript intro
TypeScript intro
 
TypeScript Introduction
TypeScript IntroductionTypeScript Introduction
TypeScript Introduction
 
Advanced Javascript
Advanced JavascriptAdvanced Javascript
Advanced Javascript
 
Type script - advanced usage and practices
Type script  - advanced usage and practicesType script  - advanced usage and practices
Type script - advanced usage and practices
 
Unit 1 - TypeScript & Introduction to Angular CLI.pptx
Unit 1 - TypeScript & Introduction to Angular CLI.pptxUnit 1 - TypeScript & Introduction to Angular CLI.pptx
Unit 1 - TypeScript & Introduction to Angular CLI.pptx
 
JavaScript - Chapter 9 - TypeConversion and Regular Expressions
 JavaScript - Chapter 9 - TypeConversion and Regular Expressions  JavaScript - Chapter 9 - TypeConversion and Regular Expressions
JavaScript - Chapter 9 - TypeConversion and Regular Expressions
 
Introduction to TypeScript
Introduction to TypeScriptIntroduction to TypeScript
Introduction to TypeScript
 
Introduction to AngularJS
Introduction to AngularJSIntroduction to AngularJS
Introduction to AngularJS
 
Angular Introduction By Surekha Gadkari
Angular Introduction By Surekha GadkariAngular Introduction By Surekha Gadkari
Angular Introduction By Surekha Gadkari
 
Angularjs PPT
Angularjs PPTAngularjs PPT
Angularjs PPT
 
Express js
Express jsExpress js
Express js
 
TypeScript VS JavaScript.pptx
TypeScript VS JavaScript.pptxTypeScript VS JavaScript.pptx
TypeScript VS JavaScript.pptx
 
Modern JS with ES6
Modern JS with ES6Modern JS with ES6
Modern JS with ES6
 
Angular 9
Angular 9 Angular 9
Angular 9
 
ES2015 / ES6: Basics of modern Javascript
ES2015 / ES6: Basics of modern JavascriptES2015 / ES6: Basics of modern Javascript
ES2015 / ES6: Basics of modern Javascript
 
Basics of JavaScript
Basics of JavaScriptBasics of JavaScript
Basics of JavaScript
 

En vedette

Power Leveling your TypeScript
Power Leveling your TypeScriptPower Leveling your TypeScript
Power Leveling your TypeScriptOffirmo
 
«Typescript: кому нужна строгая типизация?», Григорий Петров, MoscowJS 21
«Typescript: кому нужна строгая типизация?», Григорий Петров, MoscowJS 21«Typescript: кому нужна строгая типизация?», Григорий Петров, MoscowJS 21
«Typescript: кому нужна строгая типизация?», Григорий Петров, MoscowJS 21MoscowJS
 
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 DevelopersRutenis Turcinas
 
002. Introducere in type script
002. Introducere in type script002. Introducere in type script
002. Introducere in type scriptDmitrii Stoian
 
TypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret WeaponTypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret WeaponLaurent Duveau
 
TypeScript for Java Developers
TypeScript for Java DevelopersTypeScript for Java Developers
TypeScript for Java DevelopersYakov Fain
 
Александр Русаков - TypeScript 2 in action
Александр Русаков - TypeScript 2 in actionАлександр Русаков - TypeScript 2 in action
Александр Русаков - TypeScript 2 in actionMoscowJS
 
Typescript + Graphql = <3
Typescript + Graphql = <3Typescript + Graphql = <3
Typescript + Graphql = <3felixbillon
 
Angular 2 - Typescript
Angular 2  - TypescriptAngular 2  - Typescript
Angular 2 - TypescriptNathan Krasney
 
TypeScript: особенности разработки / Александр Майоров (Tutu.ru)
TypeScript: особенности разработки / Александр Майоров (Tutu.ru)TypeScript: особенности разработки / Александр Майоров (Tutu.ru)
TypeScript: особенности разработки / Александр Майоров (Tutu.ru)Ontico
 
TypeScript: Un lenguaje aburrido para programadores torpes y tristes
TypeScript: Un lenguaje aburrido para programadores torpes y tristesTypeScript: Un lenguaje aburrido para programadores torpes y tristes
TypeScript: Un lenguaje aburrido para programadores torpes y tristesMicael Gallego
 
Typescript tips & tricks
Typescript tips & tricksTypescript tips & tricks
Typescript tips & tricksOri Calvo
 
TypeScript Seminar
TypeScript SeminarTypeScript Seminar
TypeScript SeminarHaim Michael
 

En vedette (16)

Power Leveling your TypeScript
Power Leveling your TypeScriptPower Leveling your TypeScript
Power Leveling your TypeScript
 
Typescript
TypescriptTypescript
Typescript
 
«Typescript: кому нужна строгая типизация?», Григорий Петров, MoscowJS 21
«Typescript: кому нужна строгая типизация?», Григорий Петров, MoscowJS 21«Typescript: кому нужна строгая типизация?», Григорий Петров, MoscowJS 21
«Typescript: кому нужна строгая типизация?», Григорий Петров, MoscowJS 21
 
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
 
002. Introducere in type script
002. Introducere in type script002. Introducere in type script
002. Introducere in type script
 
TypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret WeaponTypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret Weapon
 
TypeScript for Java Developers
TypeScript for Java DevelopersTypeScript for Java Developers
TypeScript for Java Developers
 
Александр Русаков - TypeScript 2 in action
Александр Русаков - TypeScript 2 in actionАлександр Русаков - TypeScript 2 in action
Александр Русаков - TypeScript 2 in action
 
Typescript + Graphql = <3
Typescript + Graphql = <3Typescript + Graphql = <3
Typescript + Graphql = <3
 
TypeScript
TypeScriptTypeScript
TypeScript
 
Angular 2 - Typescript
Angular 2  - TypescriptAngular 2  - Typescript
Angular 2 - Typescript
 
TypeScript: особенности разработки / Александр Майоров (Tutu.ru)
TypeScript: особенности разработки / Александр Майоров (Tutu.ru)TypeScript: особенности разработки / Александр Майоров (Tutu.ru)
TypeScript: особенности разработки / Александр Майоров (Tutu.ru)
 
TypeScript: Un lenguaje aburrido para programadores torpes y tristes
TypeScript: Un lenguaje aburrido para programadores torpes y tristesTypeScript: Un lenguaje aburrido para programadores torpes y tristes
TypeScript: Un lenguaje aburrido para programadores torpes y tristes
 
Typescript tips & tricks
Typescript tips & tricksTypescript tips & tricks
Typescript tips & tricks
 
TypeScript Seminar
TypeScript SeminarTypeScript Seminar
TypeScript Seminar
 
TypeScriptで快適javascript
TypeScriptで快適javascriptTypeScriptで快適javascript
TypeScriptで快適javascript
 

Similaire à TypeScript - An Introduction

TypeScript introduction to scalable javascript application
TypeScript introduction to scalable javascript applicationTypeScript introduction to scalable javascript application
TypeScript introduction to scalable javascript applicationAndrea Paciolla
 
typescript.pptx
typescript.pptxtypescript.pptx
typescript.pptxZeynepOtu
 
Typescript: Beginner to Advanced
Typescript: Beginner to AdvancedTypescript: Beginner to Advanced
Typescript: Beginner to AdvancedTalentica Software
 
How I Learned to Stop Worrying and Love Typescript
How I Learned to Stop Worrying and Love TypescriptHow I Learned to Stop Worrying and Love Typescript
How I Learned to Stop Worrying and Love TypescriptThomas O'Keefe
 
Python typing module
Python typing modulePython typing module
Python typing moduleRyan Blunden
 
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 2Knoldus Inc.
 
Software Craftmanship - Cours Polytech
Software Craftmanship - Cours PolytechSoftware Craftmanship - Cours Polytech
Software Craftmanship - Cours Polytechyannick grenzinger
 
Type Script Conceitos de ts para projetos front-end React - por ruben marcus
Type Script   Conceitos de ts para projetos front-end React - por ruben marcusType Script   Conceitos de ts para projetos front-end React - por ruben marcus
Type Script Conceitos de ts para projetos front-end React - por ruben marcusRuben Marcus Luz Paschoarelli
 
Type script is awesome
Type script is awesomeType script is awesome
Type script is awesomeKeithMurgic
 
Static Type Checking with FlowJs
Static Type Checking with FlowJsStatic Type Checking with FlowJs
Static Type Checking with FlowJsUnfold UI
 
Style & Design Principles 01 - Code Style & Structure
Style & Design Principles 01 - Code Style & StructureStyle & Design Principles 01 - Code Style & Structure
Style & Design Principles 01 - Code Style & StructureNick Pruehs
 
Getting Started with TypeScript
Getting Started with TypeScriptGetting Started with TypeScript
Getting Started with TypeScriptGil Fink
 
Complete Notes on Angular 2 and TypeScript
Complete Notes on Angular 2 and TypeScriptComplete Notes on Angular 2 and TypeScript
Complete Notes on Angular 2 and TypeScriptEPAM Systems
 
web programming UNIT VIII python by Bhavsingh Maloth
web programming UNIT VIII python by Bhavsingh Malothweb programming UNIT VIII python by Bhavsingh Maloth
web programming UNIT VIII python by Bhavsingh MalothBhavsingh Maloth
 
Python for katana
Python for katanaPython for katana
Python for katanakedar nath
 
introduction to server-side scripting
introduction to server-side scriptingintroduction to server-side scripting
introduction to server-side scriptingAmirul Shafeeq
 

Similaire à TypeScript - An Introduction (20)

TypeScript introduction to scalable javascript application
TypeScript introduction to scalable javascript applicationTypeScript introduction to scalable javascript application
TypeScript introduction to scalable javascript application
 
typescript.pptx
typescript.pptxtypescript.pptx
typescript.pptx
 
Typescript: Beginner to Advanced
Typescript: Beginner to AdvancedTypescript: Beginner to Advanced
Typescript: Beginner to Advanced
 
How I Learned to Stop Worrying and Love Typescript
How I Learned to Stop Worrying and Love TypescriptHow I Learned to Stop Worrying and Love Typescript
How I Learned to Stop Worrying and Love Typescript
 
Python typing module
Python typing modulePython typing module
Python typing module
 
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
 
Software Craftmanship - Cours Polytech
Software Craftmanship - Cours PolytechSoftware Craftmanship - Cours Polytech
Software Craftmanship - Cours Polytech
 
Type Script Conceitos de ts para projetos front-end React - por ruben marcus
Type Script   Conceitos de ts para projetos front-end React - por ruben marcusType Script   Conceitos de ts para projetos front-end React - por ruben marcus
Type Script Conceitos de ts para projetos front-end React - por ruben marcus
 
Type script is awesome
Type script is awesomeType script is awesome
Type script is awesome
 
Static Type Checking with FlowJs
Static Type Checking with FlowJsStatic Type Checking with FlowJs
Static Type Checking with FlowJs
 
Python made easy
Python made easy Python made easy
Python made easy
 
Style & Design Principles 01 - Code Style & Structure
Style & Design Principles 01 - Code Style & StructureStyle & Design Principles 01 - Code Style & Structure
Style & Design Principles 01 - Code Style & Structure
 
Type script
Type scriptType script
Type script
 
Introduction to TypeScript
Introduction to TypeScriptIntroduction to TypeScript
Introduction to TypeScript
 
Getting Started with TypeScript
Getting Started with TypeScriptGetting Started with TypeScript
Getting Started with TypeScript
 
Typescript-7 (1).pptx
Typescript-7 (1).pptxTypescript-7 (1).pptx
Typescript-7 (1).pptx
 
Complete Notes on Angular 2 and TypeScript
Complete Notes on Angular 2 and TypeScriptComplete Notes on Angular 2 and TypeScript
Complete Notes on Angular 2 and TypeScript
 
web programming UNIT VIII python by Bhavsingh Maloth
web programming UNIT VIII python by Bhavsingh Malothweb programming UNIT VIII python by Bhavsingh Maloth
web programming UNIT VIII python by Bhavsingh Maloth
 
Python for katana
Python for katanaPython for katana
Python for katana
 
introduction to server-side scripting
introduction to server-side scriptingintroduction to server-side scripting
introduction to server-side scripting
 

Plus de NexThoughts Technologies (20)

Alexa skill
Alexa skillAlexa skill
Alexa skill
 
GraalVM
GraalVMGraalVM
GraalVM
 
Docker & kubernetes
Docker & kubernetesDocker & kubernetes
Docker & kubernetes
 
Apache commons
Apache commonsApache commons
Apache commons
 
HazelCast
HazelCastHazelCast
HazelCast
 
MySQL Pro
MySQL ProMySQL Pro
MySQL Pro
 
Microservice Architecture using Spring Boot with React & Redux
Microservice Architecture using Spring Boot with React & ReduxMicroservice Architecture using Spring Boot with React & Redux
Microservice Architecture using Spring Boot with React & Redux
 
Swagger
SwaggerSwagger
Swagger
 
Solid Principles
Solid PrinciplesSolid Principles
Solid Principles
 
Arango DB
Arango DBArango DB
Arango DB
 
Jython
JythonJython
Jython
 
Smart Contract samples
Smart Contract samplesSmart Contract samples
Smart Contract samples
 
My Doc of geth
My Doc of gethMy Doc of geth
My Doc of geth
 
Geth important commands
Geth important commandsGeth important commands
Geth important commands
 
Ethereum genesis
Ethereum genesisEthereum genesis
Ethereum genesis
 
Ethereum
EthereumEthereum
Ethereum
 
Springboot Microservices
Springboot MicroservicesSpringboot Microservices
Springboot Microservices
 
An Introduction to Redux
An Introduction to ReduxAn Introduction to Redux
An Introduction to Redux
 
Google authentication
Google authenticationGoogle authentication
Google authentication
 
Java 9 Features
Java 9 FeaturesJava 9 Features
Java 9 Features
 

Dernier

Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Brian Pichman
 
9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding TeamAdam Moalla
 
Building AI-Driven Apps Using Semantic Kernel.pptx
Building AI-Driven Apps Using Semantic Kernel.pptxBuilding AI-Driven Apps Using Semantic Kernel.pptx
Building AI-Driven Apps Using Semantic Kernel.pptxUdaiappa Ramachandran
 
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online CollaborationCOMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online Collaborationbruanjhuli
 
UiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPathCommunity
 
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfUiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfDianaGray10
 
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfIaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfDaniel Santiago Silva Capera
 
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve DecarbonizationUsing IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve DecarbonizationIES VE
 
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...DianaGray10
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfAijun Zhang
 
Igniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration WorkflowsIgniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration WorkflowsSafe Software
 
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Commit University
 
AI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity WebinarAI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity WebinarPrecisely
 
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Will Schroeder
 
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Adtran
 
UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6DianaGray10
 
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPAAnypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPAshyamraj55
 
NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopNIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopBachir Benyammi
 
Videogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdfVideogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdfinfogdgmi
 
Computer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and HazardsComputer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and HazardsSeth Reyes
 

Dernier (20)

Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )
 
9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team
 
Building AI-Driven Apps Using Semantic Kernel.pptx
Building AI-Driven Apps Using Semantic Kernel.pptxBuilding AI-Driven Apps Using Semantic Kernel.pptx
Building AI-Driven Apps Using Semantic Kernel.pptx
 
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online CollaborationCOMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
 
UiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation Developers
 
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfUiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
 
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfIaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
 
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve DecarbonizationUsing IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
 
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdf
 
Igniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration WorkflowsIgniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration Workflows
 
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)
 
AI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity WebinarAI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity Webinar
 
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
 
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™
 
UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6
 
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPAAnypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPA
 
NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopNIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 Workshop
 
Videogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdfVideogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdf
 
Computer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and HazardsComputer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and Hazards
 

TypeScript - An Introduction

  • 2. Hello! I am Hiten Pratap Singh I am here because I love to dive into new interesting things. You can find me at: https://github.com/hitenpratap/ https://hprog99.wordpress.com/ hiten@nexthoughts.com
  • 3. Agenda ▷ Introduction ▷ Installation ▷ Why TypeScript? ▷ Features ▷ Comparison With TypeScript Alternatives ▷ Who Uses TypeScript? ▷ Conclusion
  • 5. “TypeScript lets you write JavaScript the way you really want to. TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. Any browser. Any host. Any OS. Open Source.
  • 6. Overview ▷ Syntax based on ECMAScript 4 & ECMASCript 6 proposals ▷ TS is first and foremost a superset of JS ▷ Any regular Javascript is valid TypeScript Code
  • 7. “Microsoft's TypeScript may be the best of the many JavaScript front ends. It seems to generate the most attractive code.” - Douglas Crockford "CoffeeScript is to Ruby as TypeScript is to Java/C#/C++." - Luke Hoban
  • 9. How To Install For more details check: https://www.typescriptlang.org/docs/tutorial.html Via npm (the Node.js package manager) By installing TypeScript’s Visual Studio plugins Just download any appropriate Visual Studio from Microsoft site and you are all set to go. You can also try Visual Studio Code IDE from https://code.visualstudio.com/ which is free, open source and available for multi-platform.
  • 10. 3. Why TypeScript? Why everyone is using it more and more.
  • 11. Main Goals of TypeScript ▷ Provide an optional type system for JavaScript. ▷ Provide planned features from future JavaScript editions to current JavaScript engines ▷ Modular Development
  • 13. TypeScript Features ▷ Data Types Supported ▷ Optional Static Type Annotation ▷ Classes ▷ Interface ▷ Modules ▷ Arrow Expressions ▷ Type Assertions ▷ Ambient Declarations ▷ Source File Dependencies
  • 15. ▷ Any ▷ Primitive - Number - Boolean - String - Void - Null - Undefined - Same as JS ▷ Array ▷ Enum
  • 16. Any is used when it’s impossible to determine the type Any
  • 17. ▷ Doesn’t have separate integers and float/double type. These all are floating point values and get the type ‘number’ ▷ boolean - true/false value ▷ string - both single/double quote can be used ▷ No separate char type ▷ void - is used in function type returning nothing ▷ null and undefined - functions as usual Primitive
  • 18. Array
  • 19. By default, enums begin numbering their members starting at 0. You can change this by manually setting the value of one its members. Enum
  • 22. Type Inference ▷ TypeScript tries to infer types ▷ Four ways to variable declaration - - Type and Value in one statement - Type but no Value then Value will be undefined - Value but on Type then the it will be of Any type but maybe be inferred based on its value. - Neither Value nor Type then Type will be Any and Value will be undefined.
  • 24. ▷ Can implement interfaces ▷ Inheritance ▷ Instance methods/members ▷ Static methods/members ▷ Single constructor ▷ Default/Optional parameter ▷ ES6 class syntax TypeScript Classes
  • 27. ▷ Declared using interface keyword ▷ Like other TS features it’s design time features i.e. no extra code would be emitted to resultant JS file ▷ Errors being shown when interface signature and implementation doesn’t match. TypeScript Interfaces
  • 30. ▷ Modules can be defined using module keyword ▷ A module can contains sub-modules, class, enums or interfaces. But can’t directly contains functions. ▷ Modules can be nested(sub-modules). ▷ Classes and Interfaces can be exposed using export keyword. TypeScript Modules
  • 33. ▷ Implicit return ▷ No braces for single expression ▷ Part of ES6 ▷ Lexically scoped this ▷ You don't need to keep typing function ▷ It lexically captures the meaning of arguments Arrow Expressions
  • 36. TypeScript's type assertion are purely you telling the compiler that you know about the types better than it does, and that it should not second guess you. Type Assertions
  • 39. A major design goal of TypeScript was to make it possible for you to safely and easily use existing JavaScript libraries in TypeScript. TypeScript does this by means of declaration. Ambient Declarations
  • 41. ▷ Can be done using reference keyword ▷ Must be the first statement of file ▷ Paths are relative to the current file ▷ Can also be done using tsconfig file Source File Dependencies
  • 44. ▷ Complete language + Runtime overhaul ▷ More features: generators, comprehensions, object literals etc ▷ Will take years before widely deployed ▷ No typing as of now(Maybe ES7) TypeScript VS ES6 Harmony
  • 45. ▷ Also a superset to JavaScript ▷ More syntactic sugar, still dynamically typed ▷ Unlike TypeScript, JS is not valid CoffeeScript code ▷ It doesn’t track ECMAScript 6 TypeScript VS CoffeeScript
  • 46. ▷ Optionally typed ▷ A native VM ▷ Operator overloading ▷ ECMAScript Dart spec ▷ Completely different syntax and semantics than JS TypeScript VS DART
  • 50. Pros: ▷ High value, low cost improvement over JavaScript ▷ Safer and more modular ▷ Solid path to ECMAScript 6 Cons: ▷ Still need to know some JS quirks ▷ Current compiler slowish(Faster one is in development) Conclusion
  • 51. Thanks! Any questions? You can find me at: https://github.com/hitenpratap/ https://hprog99.wordpress.com/ hiten@nexthoughts.com
  • 52. References ▷ https://www.typescriptlang.org/docs/tutorial.html ▷ https://learnxinyminutes.com/docs/typescript/ ▷ https://basarat.gitbooks.io/typescript/content/ ▷ http://www.slideshare.net/SanderMak/typescript-coding-javascript- without-the-pain ▷ http://www.slideshare.net/aniruddha.chakrabarti/typescript-44668095