TypeScript is a free open source programming language developed and maintained by Microsoft, It is a strict syntactical superset of Javascript and it adds optional static type to the language.
It is designed for the development of large applications and transpile to JavaScript.
As it is a superset of JavaScript, existing JavaScript programs are also valid TypeScript programs.
TypeScript may be used to develop JavaScript applications for both client-side and server-side execution (with nodejs and deno). The default TypeScript Compiler can be used for transpilation or the Babel compiler can be invoked to convert TypeScript to JavaScript.
The TypeScript compiler is itself written in Typescript and compiled to Javascript. It is licensed under the Apache License 2.0, Anders Hejlsberg, lead architect of C# and creator of Delphi and Turbo Pascal, has worked on the development of TypeScript.
Need Of Typescript
As JS projects increase in size, they become difficult to maintain and huge human resources and time needed to debug the code. There are a multiple reasons for develop this.
1. JavaScript was never designed to build large-scale applications.
2. Javascript original purpose was to provide small scripting functionality for a web page.
3. Javascript didn’t provide tools and constructs for structuring large projects, such as classes, modules, and interfaces.
4. JavaScript is dynamically typed so strong optional typed support needed to develop vast applications.
5. Javascript doesn’t support features such as IntelliSense.
TypeScript files use a .ts extension, in contrast to the .js extension used by the JavaScript files. Since TypeScript is a superset of JavaScript, all valid JavaScript code is a valid TypeScript code, and renaming a .js file to .ts won’t change anything. Here is an example of a standard TypeScript program that adds two numbers and returns the result. Notice how the arguments and the return types are annotated with their type.
function add (a: number, b: number): number {
const sum = a + b;
return sum;
}
Typescript is superset of javascript means any code which is valid in java script it also valid in typescript
Benefits
Strong Typing – Optional
Object Oriented features
Compile time errors
Great tooling Access – Intelligence in code editor
Browser not understand typescript So we need to transpile the TS code to JS code so browser can understand
Typescript -> Transpile-> Javascript
Installation
npm install -g typescipt (for mac may need to add sudo)
tsc –version
mkdir ts-demo
abd create a file main.ts
function log(a){
console.log(a)
}
var a = “Hello”;
log(a);
Now compile
tsc main.ts
file will transpile to js and you can check same code in JS
now you can main.js file to execute the code by command
node main.js
Output: “Hello”
Javascript Versions
ECMAScript 1 (1997) ES1
ECMAScript 2 (1998) ES2
ECMAScript 3 (1999) ES3
ECMAScript 4 ES4
ECMAScript 5 (2009) ES5
ECMAScript2015: ES6 Added let and const, Added default parameter values, Added Array.find(), Added Array.findIndex()
ECMAScript2016: Added exponential operator (**), Added Array.includes()
ECMAScript2017 : Added string padding,Added Object.entries(),Added Object.values(),Added async functions,Added shared memory,Allows trailing commas for function parameters
ECMAScript2018 : Added rest / spread properties, Added asynchronous iteration, Added Promise.finally(), Additions to RegExp
ECMAScript2019 : String.trimStart(), String.trimEnd(), Array.flat(), Object.fromEntries, Optional catch binding
ECMAScript2020 : The Nullish Coalescing Operator (??)
In typescript variable you can not typecast directly by assigning any datatype values;
if you want so , then you have to use ‘any’ type.
If you dont use any datatype then default value is ‘any’
Datatype: number, boolean, string, number[], any[], enum
const RED = 0; const GREEN = 1; const BLUE = 2;
enum Color {RED, GREEN, BLUE}
OR
enum Color {RED = 0, GREEN =1, BLUE =2}
let bgColor = Color.RED;
now you can compile by tsc and check the JS code.
Type Assertion
let message;
message = ‘abc’;
let endsWithC = (<string>message).endsWith(‘c’);
let alterWay = (message as string).endsWith(‘c’);
Arrow Function
let doLog = (message) => console.log(message);
OR
let doLog = (message) => console.log(message);
OR
let doLog = () => console.log();