SlideShare a Scribd company logo
1 of 16
Benefits of Typescript
Basics, Features
Introduction
● TypeScript is an open-source, object-oriented programing language, which is developed
in October 2012 and maintained by Microsoft under the Apache 2 license.
● It is a strongly typed superset of JavaScript. It supports Object Oriented concept.
● TypeScript is not directly run on the browser. It needs a compiler to compile and generate
in JavaScript file.
● TypeScript is the ES6 version of JavaScript with some additional features.
● TypeScript uses TSC (TypeScript Compiler) compiler, which convert Typescript code (.ts
file) to JavaScript (.js file).
What is Echmascript
● ECMAScript is the scripting language standardized by Ecma International in the ECMA-
262 specification. ECMAScript is a language specification.
● Many languages follow and implement the ECMAScript specification, e.g., JavaScript,
ActionScript, JScript.
● Languages such as ActionScript, JavaScript, JScript all use ECMAScript as its core. As a
comparison, AS/JS/JScript are 3 different cars, but they all use the same engine... each of
their exteriors is different though, and there have been several modifications done to
each to make it unique.
ES5,ES6, ECMAScript 2016,2017,2018..
● ECMAScript 2009 (ES5) ECMASCRIPT 2015 (ES6)
Typescript versions
● The first version of TypeScript was released to the public in the month of 1st
October 2012 and was labeled as version 0.8.
● Typescript 1.0 in 2014
● Typescript 2.0 in September 2016
● Typescript 3.0 in July 2018
● Typescript 4.0 in August 2020
● The latest version of Typescript is TypeScript 4.6, released in February, 2022.
Installation
1. Install Editor
○ Visual Studio Code
○ Link : https://code.visualstudio.com/download#
2. Install Node.js Package Manager (npm)
○ provides a rich library of various JavaScript modules which simplifies the development of
web applications using Node.js
○ To install Node.js, go to the following link: https://nodejs.org/en/
○ Check version using command node –v
3. Install TypeScript
○ npm install typescript -g
○ Check the version using command tsc -v
Why use Typescript
● It supports Static typing, Strongly type, Modules, Optional Parameters, etc.
● It supports object-oriented programming features such as classes, interfaces,
inheritance, generics, etc.
● Object-oriented programming helps in making the codebase robust and clean
● The OOP features also makes TypeScript code more maintainable and organized.
● It is fast, simple, and most importantly, easy to learn.
● It provides the error-checking feature at compilation time. It will compile the code, and if
any error found, then it highlighted the mistakes before the script is run.
● It supports all JavaScript libraries because it is the superset of JavaScript.
Why use Typescript
● TypeScript support reusability because of the inheritance.
● It gives all the benefits of ES6 plus more productivity.
● TypeScript is a primary language for Angular application development.
● React is based on Javascript, but TypeScript can be helpful to React developers. It can be
used in React with some configuration settings
● Typescript also supports JSX
Static typing
● Static typing is when the compiler enforces that values use the same type.
● Above codes gives compiler error in typescript as data type number will be assigned to
salary statically so any incompatible value can not be assigned
● Data types
● To remove certain glitches and semantic error which occur in Javascript, Typescript
strongly supports static typing
● Benefits : Why Static Typing & Why is TypeScript so popular? | Engineering Education
(EngEd) Program | Section
Error Checking at Compile Time
● Javascript gets direct interpreted, so if any errors in code then they get displayed at
runtime, one at a time.
● Typescript is compiled language so, any syntactical mistakes in code will be know prior at
compile time itself to developer. And compiler to give set of errors at a time.
JS FILE TS FILE
Optional Parameters
● In TypeScript, the compiler checks every function call and issues an error in the following
cases:
○ The number of arguments is different from the number of parameters specified in the
function.
○ Or the types of arguments are not compatible with the types of function parameters.
● In typescript the compiler thoroughly checks the passing arguments, you need to
annotate optional parameters to instruct the compiler not to issue an error when you
omit the arguments.
● ‘?’ is used after argument to represent it as an optional parameter.
Optional Parameters
● In following code c is optional parameter
● The optional parameters must appear after the required parameters in the parameter
list.
Typescript classes
● For Javascript ES6 allowed to
define a class which is simply
syntactic sugar for creating
constructor function and
prototypal inheritance but we can
not annotate variables and
functions
● In typescript, class is simple and
easy to implement
● the object of this class is created
using new keyword
let person=new Person(2334, ‘Hari’,
‘Poojari’)
Typescript Inheritance
● One class can inherit visible properties of another class.
● The class which inherits properties and methods is called the child class.
And the class whose properties and methods are inherited is known as
the parent class.
● Code reusability
● Child classes can have their own additional variables and functions, thus
extending.
THANK YOU

More Related Content

Similar to Benefits of Typescript.pptx

Enforcing API Design Rules for High Quality Code Generation
Enforcing API Design Rules for High Quality Code GenerationEnforcing API Design Rules for High Quality Code Generation
Enforcing API Design Rules for High Quality Code Generation
Tim Burks
 

Similar to Benefits of Typescript.pptx (20)

Introducing type script
Introducing type scriptIntroducing type script
Introducing type script
 
Typescript - MentorMate Academy
Typescript - MentorMate AcademyTypescript - MentorMate Academy
Typescript - MentorMate Academy
 
Getting started with typescript
Getting started with typescriptGetting started with typescript
Getting started with typescript
 
TypeScript Introduction
TypeScript IntroductionTypeScript Introduction
TypeScript Introduction
 
.Net overview|Introduction Of .net
.Net overview|Introduction Of .net.Net overview|Introduction Of .net
.Net overview|Introduction Of .net
 
One language to rule them all type script
One language to rule them all type scriptOne language to rule them all type script
One language to rule them all type script
 
Porting 100k Lines of Code to TypeScript
Porting 100k Lines of Code to TypeScriptPorting 100k Lines of Code to TypeScript
Porting 100k Lines of Code to TypeScript
 
Typescript overview
Typescript overviewTypescript overview
Typescript overview
 
Enforcing API Design Rules for High Quality Code Generation
Enforcing API Design Rules for High Quality Code GenerationEnforcing API Design Rules for High Quality Code Generation
Enforcing API Design Rules for High Quality Code Generation
 
Babel.pptx
Babel.pptxBabel.pptx
Babel.pptx
 
JS-formatter
JS-formatterJS-formatter
JS-formatter
 
LAS16-108: JerryScript and other scripting languages for IoT
LAS16-108: JerryScript and other scripting languages for IoTLAS16-108: JerryScript and other scripting languages for IoT
LAS16-108: JerryScript and other scripting languages for IoT
 
TypeScript: Basic Features and Compilation Guide
TypeScript: Basic Features and Compilation GuideTypeScript: Basic Features and Compilation Guide
TypeScript: Basic Features and Compilation Guide
 
TypeScript introduction to scalable javascript application
TypeScript introduction to scalable javascript applicationTypeScript introduction to scalable javascript application
TypeScript introduction to scalable javascript application
 
Serverless Functions and Machine Learning: Putting the AI in APIs
Serverless Functions and Machine Learning: Putting the AI in APIsServerless Functions and Machine Learning: Putting the AI in APIs
Serverless Functions and Machine Learning: Putting the AI in APIs
 
The automation of the process of caring for the quality of the code in PHP an...
The automation of the process of caring for the quality of the code in PHP an...The automation of the process of caring for the quality of the code in PHP an...
The automation of the process of caring for the quality of the code in PHP an...
 
C programming
C programmingC programming
C programming
 
Mini-Training: TypeScript
Mini-Training: TypeScriptMini-Training: TypeScript
Mini-Training: TypeScript
 
TypeScript
TypeScriptTypeScript
TypeScript
 
The advantage of developing with TypeScript
The advantage of developing with TypeScript The advantage of developing with TypeScript
The advantage of developing with TypeScript
 

Recently uploaded

Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Victor Rentea
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 

Recently uploaded (20)

The Zero-ETL Approach: Enhancing Data Agility and Insight
The Zero-ETL Approach: Enhancing Data Agility and InsightThe Zero-ETL Approach: Enhancing Data Agility and Insight
The Zero-ETL Approach: Enhancing Data Agility and Insight
 
WSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering DevelopersWSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering Developers
 
Design and Development of a Provenance Capture Platform for Data Science
Design and Development of a Provenance Capture Platform for Data ScienceDesign and Development of a Provenance Capture Platform for Data Science
Design and Development of a Provenance Capture Platform for Data Science
 
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
 
Quantum Leap in Next-Generation Computing
Quantum Leap in Next-Generation ComputingQuantum Leap in Next-Generation Computing
Quantum Leap in Next-Generation Computing
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontology
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
JohnPollard-hybrid-app-RailsConf2024.pptx
JohnPollard-hybrid-app-RailsConf2024.pptxJohnPollard-hybrid-app-RailsConf2024.pptx
JohnPollard-hybrid-app-RailsConf2024.pptx
 
Vector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptxVector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptx
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
Less Is More: Utilizing Ballerina to Architect a Cloud Data Platform
Less Is More: Utilizing Ballerina to Architect a Cloud Data PlatformLess Is More: Utilizing Ballerina to Architect a Cloud Data Platform
Less Is More: Utilizing Ballerina to Architect a Cloud Data Platform
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 

Benefits of Typescript.pptx

  • 2. Introduction ● TypeScript is an open-source, object-oriented programing language, which is developed in October 2012 and maintained by Microsoft under the Apache 2 license. ● It is a strongly typed superset of JavaScript. It supports Object Oriented concept. ● TypeScript is not directly run on the browser. It needs a compiler to compile and generate in JavaScript file. ● TypeScript is the ES6 version of JavaScript with some additional features. ● TypeScript uses TSC (TypeScript Compiler) compiler, which convert Typescript code (.ts file) to JavaScript (.js file).
  • 3. What is Echmascript ● ECMAScript is the scripting language standardized by Ecma International in the ECMA- 262 specification. ECMAScript is a language specification. ● Many languages follow and implement the ECMAScript specification, e.g., JavaScript, ActionScript, JScript. ● Languages such as ActionScript, JavaScript, JScript all use ECMAScript as its core. As a comparison, AS/JS/JScript are 3 different cars, but they all use the same engine... each of their exteriors is different though, and there have been several modifications done to each to make it unique.
  • 4. ES5,ES6, ECMAScript 2016,2017,2018.. ● ECMAScript 2009 (ES5) ECMASCRIPT 2015 (ES6)
  • 5. Typescript versions ● The first version of TypeScript was released to the public in the month of 1st October 2012 and was labeled as version 0.8. ● Typescript 1.0 in 2014 ● Typescript 2.0 in September 2016 ● Typescript 3.0 in July 2018 ● Typescript 4.0 in August 2020 ● The latest version of Typescript is TypeScript 4.6, released in February, 2022.
  • 6. Installation 1. Install Editor ○ Visual Studio Code ○ Link : https://code.visualstudio.com/download# 2. Install Node.js Package Manager (npm) ○ provides a rich library of various JavaScript modules which simplifies the development of web applications using Node.js ○ To install Node.js, go to the following link: https://nodejs.org/en/ ○ Check version using command node –v 3. Install TypeScript ○ npm install typescript -g ○ Check the version using command tsc -v
  • 7. Why use Typescript ● It supports Static typing, Strongly type, Modules, Optional Parameters, etc. ● It supports object-oriented programming features such as classes, interfaces, inheritance, generics, etc. ● Object-oriented programming helps in making the codebase robust and clean ● The OOP features also makes TypeScript code more maintainable and organized. ● It is fast, simple, and most importantly, easy to learn. ● It provides the error-checking feature at compilation time. It will compile the code, and if any error found, then it highlighted the mistakes before the script is run. ● It supports all JavaScript libraries because it is the superset of JavaScript.
  • 8. Why use Typescript ● TypeScript support reusability because of the inheritance. ● It gives all the benefits of ES6 plus more productivity. ● TypeScript is a primary language for Angular application development. ● React is based on Javascript, but TypeScript can be helpful to React developers. It can be used in React with some configuration settings ● Typescript also supports JSX
  • 9. Static typing ● Static typing is when the compiler enforces that values use the same type. ● Above codes gives compiler error in typescript as data type number will be assigned to salary statically so any incompatible value can not be assigned ● Data types ● To remove certain glitches and semantic error which occur in Javascript, Typescript strongly supports static typing ● Benefits : Why Static Typing & Why is TypeScript so popular? | Engineering Education (EngEd) Program | Section
  • 10. Error Checking at Compile Time ● Javascript gets direct interpreted, so if any errors in code then they get displayed at runtime, one at a time. ● Typescript is compiled language so, any syntactical mistakes in code will be know prior at compile time itself to developer. And compiler to give set of errors at a time. JS FILE TS FILE
  • 11. Optional Parameters ● In TypeScript, the compiler checks every function call and issues an error in the following cases: ○ The number of arguments is different from the number of parameters specified in the function. ○ Or the types of arguments are not compatible with the types of function parameters. ● In typescript the compiler thoroughly checks the passing arguments, you need to annotate optional parameters to instruct the compiler not to issue an error when you omit the arguments. ● ‘?’ is used after argument to represent it as an optional parameter.
  • 12. Optional Parameters ● In following code c is optional parameter ● The optional parameters must appear after the required parameters in the parameter list.
  • 13. Typescript classes ● For Javascript ES6 allowed to define a class which is simply syntactic sugar for creating constructor function and prototypal inheritance but we can not annotate variables and functions ● In typescript, class is simple and easy to implement ● the object of this class is created using new keyword let person=new Person(2334, ‘Hari’, ‘Poojari’)
  • 14. Typescript Inheritance ● One class can inherit visible properties of another class. ● The class which inherits properties and methods is called the child class. And the class whose properties and methods are inherited is known as the parent class. ● Code reusability ● Child classes can have their own additional variables and functions, thus extending.
  • 15.