| File Extension is .ts or .tsx. |
File Extension is .js. |
| It is an object-oriented programming language. |
It is a scripting language. |
| Typescript is strongly typed and it supports both static and dynamic typing. |
There is no static typing. Its dynamic language. |
We can declare a variable with data types.
var name: string;
var age: number;
|
JavaScript doesn’t have data types, so we cannot declare variables the same as TypeScript. |
TypeScript supports modules.
// hello.ts
export function helloWorld() {
console.log("Hello, world!");
}
/* Then above "helloWorld" function
is imported by as follows in
another file*/
import { helloWorld } from "./hello";
helloWorld();
|
JavaScript doesn’t support modules. |
TypeScript has Types and Interfaces.
interface Song {
name: string,
movie: string
};
const song: Song = {
name: "Sample_Song",
movie: "Sample_Movie"
};
|
No concept of types and interface in JavaScript. |
TypeScript supports optional parameter function.
function add(a: number,
b: number, c?: number): number {
if (typeof c !== 'undefined') {
return a + b + c;
}
return a + b;
}
add(2,2,3) //returns 7
add(2,2) //returns 4
|
JavaScript has no optional parameter function. |
TypeScript supports function overloading.
function add (a: string,
b: string) : string {
return a + b;
};
function add(a : number,
b : number) : number {
return a + b;
};
add("Hi ", "Hi ")
// Above returns "Hi Hi"
add(10, 20);
// Above returns 30
|
JavaScript doesn’t support function overloading. |
| TypeScript supports generics. |
JavaScript doesn't support generics. |
| It supports data type. So we can avoid run time error due to assigning the invalid type of values to the variable. |
It doesn’t support data type. So could possible to assign an invalid value assigned to the variable. |
| It compiles the code and highlighted errors during the compile time itself. |
It is interpreted language. So, it is highlighted the errors only on runtime. |
Sample for TypeScript
function add(a : number,
b : number) : number {
return a + b;
}
- add(10, 20); //returns 30
- add(10, ‘b’); //compile-time error occurs
|
Example for JavaScript
function add(a, b){
return a + b;
}
- add(10, 20); //returns 30
- add(10, ‘b’); //returns 10b
|
| It is a superset of JavaScript, developed to overcome code complexity for large projects. |
It helps create dynamic web page content. |
| It is not directly run on the browser. It will be converted into JavaScript code to be understandable for browsers. |
It is directly run on browsers |
| In TypeScript, numbers and strings are the interfaces. |
In JavaScript, numbers and strings are the objects. |