TypeScript Arrays - GeeksforGeeks

11 Jun, 2021
An array is a user-defined data type. An array is a homogeneous collection of similar types of elements that have a contiguous memory location and which can store multiple values of different data types.An array is a type of data structure that stores the elements of similar data type and consider it as an object too. We can store only a fixed set of elements and can’t expand its size, once its size is declared.The array follows Index based storage i.e)the first element of an array is stored at index 0 or at index ‘i’ and the remaining elements are stored at the location ‘i+1’.Features of an Array  
Same data type of elements is stored in an array.
 
Array elements are always stored in contiguous memory locations.
 
Storage of 2-D array elements are rowed by row in a contiguous memory location.
 
The Starting element of address is represented by the array name.
 
The size of an array should be declared at the time of initialization.
 
The remaining elements of an array can be retrieved by using the starting index of an Array.
Typescript supports array just like that in JavaScript. There are two ways to declare an array in typescript:1. Using square brackets.  
let array_name[:datatype] = [val1, val2, valn..]  
Example:  
javascript
let fruits: string[] = ['Apple', 'Orange', 'Banana'];
2. Using a generic array type. TypeScript array can contain elements of different data types, as shown below.  
let array_name: Array = [val1, val2, valn..]  
Example: Multi Type Array  
javascript
var values: (string | number)[] = ['Apple', 2, 'Orange', 3, 4, 'Banana'];// orvar values: Array = ['Apple', 2, 'Orange', 3, 4, 'Banana'];
Example: Access Array Elements  
Array elements access on the basis of index i.e.)ArrayName[index].
 
javascript
let fruits: string[] = ['Apple', 'Orange', 'Banana'];fruits[0]; // returns Applefruits[1]; // returns Orangefruits[2]; // returns Bananafruits[3]; // returns undefined
We can access the array elements by using the ‘FOR’ loop:
javascript
let fruits: string[] = ['Apple', 'Orange', 'Banana']; for(var index in fruits){    console.log(fruits[index]);  // output: Apple Orange Banana} for(var i = 0; i < fruits.length; i++){    console.log(fruits[i]); // output: Apple Orange Banana}
Advantages Code Optimization: We can retrieve or sort the array data more efficiently. Random access: We can randomly access the array data using the location pointer.Disadvantages Size Limit: The size of an Array is fixed i.e.)static. We cannot increase the array size once it has been declared.
There are two types of an array: 1.Single-Dimensional Array 2.Multi-Dimensional Array 
Single-Dimensional Array It is the simplest form of an array that contains only one row for storing data. It contains single set of the square bracket (“[]”). Syntax:  
let array_name[:datatype]; 
Initialization:  
array_name = [val1, val2, valn..]
Example: 
javascript
let arr:number[];  arr = [1, 2, 3, 4]  console.log("Array[0]: " +arr[0]);  console.log("Array[1]: " +arr[1]); 
Output:  
Array[0]: 1
Array[1]: 2
Multi-Dimensional Array The data is stored in rows and columns (also known as matrix form) in a Multi-dimensional array.TypeScript Arrays Syntax:  
let arr_name:datatype[][] = [ [a1, a2, a3], [b1, b2, b3] ];  
Initialization:  
let arr_name:datatype[initial_array_index][referenced_array_index] = [ [val1, val2, val 3], [v1, v2, v3]];  
Example: 
javascript
var mArray:number[][] = [[10, 20, 30], [50, 60, 70]] ; console.log(mArray[0][0]); console.log(mArray[0][1]); console.log(mArray[0][2]); console.log(); console.log(mArray[1][0]); console.log(mArray[1][1]); console.log(mArray[1][2]); 
OUTPUT:  
10
20
30

50
60
70
Array ObjectWe can create an Array by using or initializing the Array Object. The Array constructor is used to pass the following arguments to create an Array:  
With the numeric value which represents the size of an array.
 
A list of comma separated values.
Syntax:  
1.let arr_name:datatype[] = new Array(values);  
Example:  
javascript
// Initializing an Array by using the Array object. let arr:string[] = new Array("GEEKSFORGEEKS", "2200", "Java", "Abhishek"); for(var i = 0;i<arr.length;i++) {     console.log(arr[i]); 
Output:  
GEEKSFORGEEKS
2200
Java
Abhishek
Passing an Array to a Function We can pass an Array to a function by specifying the Array name without an index. Example:  
javascript
let arr:string[] = new Array("GEEKSFORGEEKS", "2300", "Java", "Abhishek");  // Passing an Array in a function function display(arr_values:string[]) {    for(let i = 0;i<arr_values.length;i++) {        console.log(arr[i]);    }   } // Calling an Array in a function display(arr);
Output  
GEEKSFORGEEKS
2300
Java
Abhishek 
Using TypeScript ‘Spread’ operator The spread operator can be used to initialize arrays and objects from another array or object. It can also be used for object destructuring. It is a part of ECMAScript 6 version. 
javascript
let arr1 = [ 1, 2, 3]; let arr2 = [ 4, 5, 6]; //Create new array from existing array let copyArray = [...arr1];    console.log("CopiedArray: " +copyArray); //Create new array from existing array with more elements let newArray = [...arr1, 7, 8]; console.log("NewArray: " +newArray); //Create array by merging two arrays let mergedArray = [...arr1, ...arr2]; console.log("MergedArray: " +mergedArray);
Output: 
CopiedArray: 1, 2, 3
NewArray: 1, 2, 3, 7, 8
MergedArray: 1, 2, 3, 4, 5, 6
 
ruhelaa48
TypeScript
Web Technologies
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Comments
Old Comments
Express.js express.Router() Function
How to fetch data from an API in ReactJS ?
Difference between var, let and const keywords in JavaScript
Differences between Functional Components and Class Components in React
How to Insert Form Data into Database using PHP ?
REST API (Introduction)
Convert a string to an integer in JavaScript
File uploading in React.js
How to set input type date in dd-mm-yyyy format using HTML ?
How to redirect to another page in ReactJS ?