Introduction

In this blog, we are going to see about the difference between TypeScript and JavaScript. JavaScript is a scripting language that is used for both client-side and server-side programming languages. JavaScript is complex and heavy for large-scale applications and also not able to full fill the requirement of OOP concepts in server-side programming. So, TypeScript was developed to fulfill this gap.

Difference between TypeScript and JavaScript
 

TypeScript JavaScript
 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.

I hope you liked it and learned about the differences between TypeScript and JavaScript.