TypeScript Function tutorial

A TypeScript function is a group of statements which is used for performing a specific task. It provides the facility of code re-usability.

Typescript function declaration:

function  function_name() { 
   // function body 
}

Typescript function invocation:

function_name();

Typescript Function Example:

function hello() {   
   //function definition 
   console.log("Hello World!"); 
}
hello();//function invocation

Typescript returning function

Typescript returning function syntax:

function function_name():return_type { 
   //block of statements 
   return value; 
}

Typescript Returning Function Example:

function getMessage():string { 
   return "Hello World!";
} 
 
function sayHello() { 
   var msg = getMessage();
   console.log(msg);
} 
 
sayHello();

Typescript parameterized function

Typescript parameterized function syntax:

function function_name( param1:datatype, ( param2:datatype) {   
}

Typescript Parameterized Function Example:

function paramTest(rollNo:number,name:string) { 
   console.log(rollNo);
   console.log(name);
} 
paramTest(645,"Jai");

Typescript function optional parameter

Every parameter is assumed to be required by the function, in TypeScript. In short, the number of parameters given to a function at function call has to match the number of parameters in the function definition. We can mark a parameter optional by appending a question mark to its name. Optional parameter should be the last parameter of the function.

Typescript function optional parameter syntax:

function function_name (param1:datatype, param2?:datatype)

Typescript function optional parameter example:

function dispDetails(fname:string,lname?:string) {  
   console.log("Fisrt Name",fname); 
 
   if(lname!=undefined)  
   console.log("Last Name",lname); 
}
dispDetails("Asmita");
dispDetails("Nidhi", "Gupta");

Typescript rest parameters

When we talked about optional and default parameters all have one common thing, they talk about one parameter at a time. Sometimes we need multiple parameters as a group. TypeScript rest parameters used in such situations. They are act as the placeholder for multiple arguments of the same type. Use the ellipsis (…) as the prefix of rest parameter.

Typescript rest parameters syntax:

function function_name (…param1:datatype)

Typescript rest parameters example:

function showNames(...names:string[]) {    
   for(var i = 0;i<names.length;i++) { 
      console.log(names[i]);
   } 
} 
showNames("Rajeev","Gunjan","Vikram","Asmita"); 
showNames("Mahesh", "Jai", "Narender", "Vishal", "Hemant");

Typescript default parameters

The TypeScript default-initialized parameters are used to set a default value to the parameter if the user does not provide one.
Note: We cannot declare a parameter optional and default at the same time.

Typescript default parameters syntax:

function function_name(param1:datatype,param2:datatype = default_value)

Typescript default parameters example:

function displayDetails(name:string,sport:string = "Cricket") {  
   console.log("Name: " +name + ", Sport: "+ sport); 
} 
displayDetails("Jai");
displayDetails("Vivek","Football");

A function created without function name is known as anonymous function.

Typescript anonymous function syntax:

Typescript anonymous function syntax:

var result = function( [arguments] ) { ... }

Typescript anonymous function example:

var sayHello = function() { 
   return "Hello World!";  
} 
console.log(sayHello());

Typescript anonymous function with parameters example:

var sayHello = function(name:string) { 
   return "Hello "+name;  
} 
console.log(sayHello("Jai"));

Typescript function constructor

TypeScript provides the facility to create a function with the built-in JavaScript constructor called Function ().

Typescript function constructor syntax:

var result = new Function( [arguments] ) { ... }

Typescript function constructor example:

var myFunction = new Function("num1", "num2", "return num1 + num2"); 
var result = myFunction(10, 15); 
console.log(result);

Arrow / Lambda function:

Typescript lambda or arrow functions are used to represent anonymous functions.

Parts of Arrow / Lambda function:

  • Parameters
  • Arrow notation/lambda notation (=>)
  • Statements

Typescript Arrow / Lambda function syntax:

( [param1, parma2,…param n] )=>statement;

Typescript Arrow / Lambda function example:

var calculateSquare = (num:number)=> {    
   num = num * num; 
   console.log(num); 
} 
calculateSquare(10);

Ways to implement method overloading:

Method overloading means more than one methods with the same name but different parameters. Parameters can be differing in types, numbers or order.

Ways to implement method overloading:

  • Parameters differ in types.
    function showDetails(s1:string):void; 
    function showDetails(num1:number):void;
  • Parameters differ in number.
    function showDetails(s1:string):void; 
    function showDetails(x:string, y:string):void;
  • Parameters differ in order
    function showDetails(num1:numer, s1:string):void; 
    function showDetails(s2:string, num2:number):void;

Typescript function overloading example:

function showDetails(name:string):void{
  console.log(name); 
} 
function showDetails(empId:number):void{
  console.log(empId); 
}
showDetails("Jai") 
showDetails(123);

 

Please Share