TypeScript Arrays

An array is a user-defined data type. An array is a homogenous 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:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    let fruits: string[] = ['Apple', 'Orange', 'Banana']; 

    chevron_right

    
    

    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

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    var values: (string | number)[] = ['Apple', 2, 'Orange', 3, 4, 'Banana']; 
    // or 
    var values: Array = ['Apple', 2, 'Orange', 3, 4, 'Banana']; 

    chevron_right

    
    

    Example: Access Array Elements

  • Array elements access on the basis of index i.e.)ArrayName[index].
  • filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    let fruits: string[] = ['Apple', 'Orange', 'Banana']; 
    fruits[0]; // returns Apple
    fruits[1]; // returns Orange
    fruits[2]; // returns Banana
    fruits[3]; // returns undefined

    chevron_right

    
    

  • We can access the array elements by using the ‘FOR’ loop:
  • filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    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
    }

    chevron_right

    
    

    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:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    let arr:number[];   
    arr = [1, 2, 3, 4]   
    console.log("Array[0]: " +arr[0]);   
    console.log("Array[1]: " +arr[1]);  

    chevron_right

    
    

    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:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    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]);  

    chevron_right

    
    

    OUTPUT:

    10
    20
    30
    
    50
    60
    70
    

    Array Object

    We 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:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    // 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]);  

    chevron_right

    
    

    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:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    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);

    chevron_right

    
    

    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.

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    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); 

    chevron_right

    
    

    Output:

    CopiedArray: 1, 2, 3
    NewArray: 1, 2, 3, 7, 8
    MergedArray: 1, 2, 3, 4, 5, 6
    


    My Personal Notes arrow_drop_up

    Check out this Author's contributed articles.

    If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

    Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.




    Article Tags :

    Be the First to upvote.


    Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.