TypeScript Tuples

As we know array consists of values of homogeneous (same) types but sometimes when we need to store a collection of a different types values in a single variable, then we will go with Tuples. They are just like structure in C programming and can also be passed as parameters in a function call. Tuples may be one or more than one types of data (like number with string or string with number and so on).

• To denote a multi-dimensional coordinate system the term used is tuple in abstract mathematics.
• In JavaScript we doesn’t have tuples as data types, but in typescript Tuples facility is available.

Syntax

let tuple_name = [val1, val2, val3, ...val n];  

Example:

let arrTuple = [501, "welcome", 505, "Mohan"];  
console.log(arrTuple);

Output:

[501, ‘welcome’, 105, ‘Mohan’]

Declaration and initialization of a tuple separately by initially declaring the tuple as an empty tuple in Typescript. Example:

let arrTuple = [];   
arrTuple[0] = 501  
arrTuple[1] = 506 

Accessing tuple Elements With the help of index basis we can read or access the fields of a tuples, which is the same as an array. An index starts from zero too. 

Example:

var employee: [number, string] = [1, "Steve"];
employee[0]; // returns 1
employee[1]; / return Steve

Output:

1 Steve

We can declare heterogeneous datatypes in tuples like: number and string simultaneously.

 Example

let empTuple = ["Vivek Singh", 22, "Honesty"];  
console.log("Name of the Employee is : "+empTuple [0]);  
console.log("Age of the Employee is : "+empTuple [1]);  
console.log(empTuple [0]+" is working in "+empTuple [2]);  

Output:

Name of the Employee is : Vivek Singh Age of the Employee is : 22 Vivek Singh is working in Microsoft

Operations on Tuple A tuple has two operations:

• Push()
• Pop()

Push() To add an element to the tuple with push operation. Example

var employee: [number, string] = [1, "Steve"];
employee.push(2, "Bill"); 
console.log(employee); 

Output:

[1, ‘Steve’, 2, ‘Bill’]

This type of declaration is allowed in tuples because we are adding number and string values to the tuple and they are valid for the employee tuple. 

Example

let empTuple = ["Vivek Singh", 22, "Honesty"];  
console.log("Items: "+empTuple);   // here we print tuple elements
empTuple.push(10001);   // append value to the tuple   
console.log("Length of Tuple Items after push: "+empTuple.length);  // After pushing elements in tuples calculate length of tuples.
console.log("Items: "+empTuple);  

Output:

Items: Vivek Singh, 22, Honesty Length of Tuple Items after push: 4 Items: Vivek Singh, 22, Honesty, 10001

To add an element to the tuple with push operation. 

Example

let empTuple = ["Mohit Singh", 25, "neveropen", 10001];  
console.log("Items: "+empTuple);   // here we print tuple elements
empTuple.pop();   // removed value to the tuple   
console.log("Length of Tuple Items after pop: "+empTuple.length);  After pushing elements in tuples calculate length of tuples.
console.log("Items: "+empTuple);  

Output:

Items: Mohit Singh, 25, neveropen, 10001 Length of Tuple Items after pop: 3 Items: Mohit Singh, 25, neveropen

Update or Modify the Tuple Elements We need to use the index of the fields and assignment operator for modifying the fields of tuple. It can be shown in the following example. Example

let empTuple = ["Ganesh Singh", 25, "TCS"];  
empTuple[1] = 60;  
console.log("Name of the Employee is: "+empTuple [0]);  
console.log("Age of the Employee is: "+empTuple [1]);  
console.log(empTuple [0]+" is working in "+empTuple [2]); 

Output:

Name of the Employee is: Ganesh Singh Age of the Employee is: 60 Ganesh Singh is working in TCS

Clear the fields of a Tuple Fields could be cleared but we cannot delete the tuple variables. To clear the fields of a tuple, assign it with an empty tuple field set as shown below:

let empTuple = ["Rohit Sharma", 25, "JavaTpoint"];  
empTuple = [];  
console.log(empTuple); 

Output:

[]

In TypeScript, To break up the structure of an entity by destructuring. 

Example

let empTuple = ["Rohit Sharma", 25, "JavaTpoint"];  
let [emp, student] = empTuple;  
console.log(emp);  
console.log(student);  

Rohit Sharma 25

Passing Tuple to Functions

//Tuple Declaration  
let empTuple = ["JavaTpoint", 101, "Abhishek"];     
//Passing tuples in function    
function display(tuple_values:any[]) {    
   for(let i = 0;i<empTuple.length;i++) {     
      console.log(empTuple[i]);    
   }      
}    
//Calling tuple in function    
display(empTuple);

JavaTpoint 101 Abhishek

Following shown is the code snippet which will help us to understand Tuple creation in TypeScript:-

Example:

Output:

[ 1, 'Aman', 'CSE', 2, 'Ram', 'CSE' ]