❖ Presents a seminar on JavaScript and

TypeScript..

❖ By – Riyal Savaj (Sr. Developer)

Yusuf Pathan (Sr. Developer)
 Contents
✔ What is JavaScript
✔ What is TypeScript
✔ ECMAScript
✔ ES5 vs ES6
✔ Key difference between JS and TS
✔ TypeScript Code Example
✔ Why TypeScript
✔ Features of TypeScript
What is JavaScript?
• JavaScript is a scripting language which helps you create interactive
web pages.
• It follows rules of client-side programming, so it runs in the user’s web
browser without the need of any resources forms the web server.
• You can also use JavaScript with other technologies like REST APIs,
XML, and more.
• However, JavaScript is not designed for large complex applications. It
was developed for applications with a few hundred lines of code!
• TypeScript is a modern age JavaScript development language.
• It is a statically compiled language to write clear and simple JavaScript
code.
• It can be run on Node.js or any browser which supports ECMAScript3
or newer versions.
• TypeScript provides optional static typing, classes, and interface.
• For a large JavaScript project adopting Typescript can bring you more
robust software and easily deployable with a regular JavaScript
application.
What is ECMAScript?
 ECMAScript
✔ ECMAScript (European Computer Manufacturers Association
Script) is a scripting language based on JavaScript.

✔ Invented by Brendan Eich at Netscape, ECMAScript made its first

appearance in the Navigator 2.0 browser.

✔ It was created to standardize JavaScript. ECMAScript is used for

client-side scripting of the World Wide Web.

✔ ES5 is an abbreviation of ECMAScript 5 and also known

as ECMAScript 2009. The sixth edition of the ECMAScript standard
is ES6 or ECMAScript 6. 
Difference Between ES5 and
ES6.

VS ES6
ES5
 ES5 VS ES6
ES5 ES6
• ES5 supports primitive data types that are string, • In ES6, there are some additions to JavaScript
number, boolean, null, and undefined. data types. It introduced a new primitive data
type 'symbol' for supporting unique values.

• In ES5, we could only define the variables by • In ES6, there are two new ways to define
using the var keyword. variables that are let and const.

• As ES5 is prior to ES6, there is a non-presence of • Because of new features and the shorthand
some features, so it has a lower performance than storage implementation ES6 has a higher
ES6. performance than ES5.
• ES5 is time-consuming than ES6. • Due to destructuring and speed operators,
object manipulation can be processed more
smoothly in ES6.
• In ES5, both function and return keywords are • An arrow function is a new feature introduced in
used to define a function. ES6 by which we don't require
the function keyword to define the function.

• In ES5, there is a use of for loop to iterate over • ES6 introduced the concept of for...of loop to
elements. perform an iteration over the values of the
iterable objects.
Difference Between TypeScript and
JavaScript.

VS JavaS
S cri pt cript
Ty p e
 Parameter Typescript JavaScript
1) What is ✔ Powerful type system, including generics ✔ Lightweight, interpreted, object-
& JS features oriented language with first-class
functions

2) Data Binding ✔ TypeScript uses concepts like types and ✔ No such concept is available with
interfaces to describe data being used. JavaScript.

3) Npm package ✔ JavaScript offers the option to explore

✔ With Typescript, many npm packages and create code without a build step.
either come with static type definitions
or have an external one that is easy to
install.

4) Prototyping ✔ Typescript has a feature of prototyping. ✔ JavaScript doesn’t have this

feature.

5) Compilation ✔ TypeScript code needs to be compiled

✔ No need to compile JavaScript.

6) Community ✔ Typescript does not have a large ✔ The JavaScript has a huge community
community of developers. of developers
Typescript code example…
Why TypeScript ?
✔ TypeScript is a superset of JavaScript which primarily provides
optional static typing, classes and interfaces.
✔ One of the big benefits is to enable IDEs to provide a richer
environment for spotting common errors as you type the code.
✔ It is open source, but you only get the clever Intellisense as you type if
you use a supported IDE.
✔ TypeScript supports JS libraries & API Documentation
✔ Better code structuring and object-oriented programming techniques
✔ Allows better development time tool support
✔ It can extend the language beyond the standard decorators, async/await
Features of JavaScript and
TypeScript…
 JavaScript TypeScript

✔ It’s a cross-platform language ✔ Maintainability

✔ It’s used for client side and server side ✔ Offered great productivity for
developers

✔ It’s easy to learn and to start with ✔ Code navigation and bug prevention

✔ It’s a dynamic language: flexible and ✔ Optional Static Type Annotation /

powerful Static Typing

✔ You have ‘the great freedom’ to do ✔ Class-based object-oriented with the

whatever you want with any object inheritance of private members and
interfaces.

✔ Added Dependencies ✔ Supports interfaces, sub-interfaces,

classes, and subclasses