Javascript arrays and array methods

Javascript arrays and array methods

Array declaration

  1. Method1:

     const myArr = [1,2,3,4,5];
    
  2. Method2:

     const myArr2 = new Array(1,2,3,4)
    

Accessing array elements and array properties

  1. Length: Array.length is one of the most commonly used properties of an array. It returns the number of elements in the array.

     const myArr2 = new Array(1,2,3,4)
     console.log(myArr2.length) //Output: 4
    
  2. index properties: Arrays in JavaScript are zero-indexed, meaning the first element starts at index 0, the second at index 1, and so on. They have properties corresponding to each index where elements are stored.

     const myArr2 = new Array(1,2,3,4)
     console.log(myArr2[1]) //Output: 2
     console.log(myArr2[3] //Output: 4
    

Array methods

  1. push() method:

    The push method in an array accepts 1 argument which is an element to be added and pushes it to the last index of an array. Below is an example of an array push method.

     const myArr = new Array(1,2,3,4)
     myArr.push(6); //Push 1 element
     console.log(myArr); //Output: [ 1, 2, 3, 4, 6 ]
     myArr.push(8,9);  //Push multiple elements
     console.log(myArr);
     //Output: [ 1, 2, 3, 4, 8, 9 ]
    
  2. pop () method:

    The pop method in an array removes an element from the last index of an array. Below is an example of an array pop method.

     const myArr = new Array(1,2,3,4)
     myArr.pop(); //removes the element from last index
     console.log(myArr); //Output: [ 1, 2, 3]
    
  3. unshift() method:

    The unshift method in an array adds one or more elements to the beginning of an array. Below is an example of an array unshift method.

     const myArr = new Array(1,2,3,4)
     myArr.unshift(10);  //inserts an given element at 0th index of an array
     console.log(myArr); //Output: [10, 1, 2, 3, 4]
     myArr.unshift(15,14);  //inserts multiple elements
     console.log(myArr); //Output: [15, 14, 10, 1, 2, 3, 4]
    
  4. shift() method:

    The shift method in an array removes an element from the beginning of an array. Below is an example of an array shift method.

     const myArr = new Array(1,2,3,4)
     myArr.shift();  //inserts an given element at 0th index of an array
     console.log(myArr); //Output: [2, 3, 4]
    
  5. includes() method

    The includes() method in an array returns true or false on whether the given element is present in the array or not. Below is an example of an includes() method.

     const myArr = new Array(1,2,3,4)
     console.log(myArr.includes(10)); //Output: false
     console.log(myArr.includes(3)); //Output: true
    
  6. indexOf() method

    The indexOf method in an array returns true or false on whether the given element is present in the array or not. If the user enters an index greater than the array length then -1 is returned. Below is an example of an indexOf method.

     const myArr = new Array(1,2,3,4)
     console.log(myArr.indexOf(3)); //Output: 2
     console.log(myArr.indexOf(5)); //Output: -1
    
  7. join() method:

    The join method returns a string where each array element is concatenated into a single string.

     const myArr = [1,2,3,4,5];
     const newArr = myArr.join()
     console.log(myArr); //prints array Output: [ 1, 2, 3, 4, 5 ]
     console.log(newArr); //prints string Output: 1,2,3,4,5
    
  8. slice() method:

    The slice method extracts a section of elements from an array and returns a new array containing the selected elements. The slice method does not modify the original array instead, it returns a new array containing elements sliced from the original array. The method accepts two arguments start and end whereas the start is inclusive and the end is exclusive. If we skip the end argument then the returned array is sliced from the start index till the end of the original array.

     const myArr = [1,2,3,4,5];
     let newArr = myArr.slice(1,3) //[1 inclusive, 3 exclusive] get's the 1st and second index from the original array and stores it to the mnA array original array doesn't affects by this operation
     console.log(newArr ) //Output: [ 2, 3]
     console.log(myArr) //Output: [ 1, 2, 3, 4, 5];
    
     newArr = myArr.slice(2)
     console.log(newArr) //Output: [ 3, 4, 5 ]
    
  9. splice() method:

    The splice() method returns an array of the removed elements from the original array, leaving the modified elements in the original array.

    It accepts two arguments: The start parameter determines the index from which elements are removed or replaced. The deleteCount (optional) specifies the number of elements to remove. If new elements are to be added, they can be included as additional parameters after deleteCount. If deleteCount is omitted then splice() will remove all elements from the start index to the end of the array. Below is an example for the splice method:

     let colors = ['red', 'green', 'blue', 'yellow', 'orange'];
     let removedElements = colors.splice(1, 2); // Removes two elements starting from index 1
     console.log(colors); // Outputs: ['red', 'yellow', 'orange']
     console.log(removedElements); // Outputs: ['green', 'blue']
    
     let colors2 = ['red', 'green', 'blue', 'yellow', 'orange'];
     let removedElements2 = colors2.splice(1, 2, 'violet', 'purple');
     console.log(colors2); // Output after splice: ['red', 'violet', 'purple', 'yellow', 'orange']
     console.log(removedElements2); // Removed elements: ['green', 'blue']
    
  10. push() method:

    The push method pushes the new element into the array at the last index of an array. Below is an example of the push method.

    let colors = ['red', 'green', 'blue', 'yellow', 'orange'];
    colors.push("violet")
    console.log(colors) //Output:  ['red', 'green', 'blue', 'yellow', 'orange', 'violet']
    
  11. concat() method:

    The contact method combines the two arrays and returns a new array. Below is an example of the concat() method.

    const marvelHeros = ["Thor", "Ironman","Spiderman"]
    const DCHeros = ["Batman", "Flash","SUperman"]
    const newHeros = marvelHeros.concat(DCHeros)  
    console.log(newHeros) //Output: [ 'Thor', 'Ironman', 'Spiderman', 'Batman', 'Flash', 'SUperman' ]
    
  12. spread() method

    The spread method is also used to combine the arrays just like the concat method but this can combine multiple arrays not just 2 as shown in the below example.

    const marvelHeros = ["Thor", "Ironman","Spiderman"]
    const DCHeros = ["Batman", "Flash","SUperman"]
    const otherHeroes = ["shaktiman","krish"]
    const allNewHeros = [...marvelHeros,...DCHeros,...otherHeroes]
    console.log(allNewHeros) //Output: [ 'Thor', 'Ironman', 'Spiderman', 'Batman', 'Flash', 'SUperman', 'shaktiman', 'krish']
    
  13. flat() method

    The flat method in JavaScript is used to flatten nested arrays by concatenating sub-arrays and sub-array elements into a single array. This is particularly useful when you have arrays within an array and you want to create a single-level array. Below is an example of the flat() method.

    const anotherArr = [1, 2, 3, [4, 5, 6], 7, [6, 7, [4, 5]]]
    console.log(anotherArr) //Output: [ 1, 2, 3, [ 4, 5, 6 ], 7, [ 6, 7, [ 4, 5 ] ] ]
    const usableAnotherArr = anotherArr.flat(Infinity)
    console.log(usableAnotherArr)   //Output: [ 1, 2, 3, 4, 5, 6, 7, 6, 7, 4, 5]
    
  14. Array.isArray() method:

    The Array.isArray() function checks whether given data is array or not and returns the boolean value true or false.

    console.log(Array.isArray("Hello")) // Output: false
    console.log(Array.isArray([1,2,3])) // Output: true
    
  15. Array.from() method

    The array.from() method converts the given data to an array. Below is an example of the Array.from() method.

    console.log(Array.from("Hello")) //Output: [ 'H', 'e', 'l', 'l', 'o' ]
    
  16. Array.of(method):

    The Array.of() method converts multiple data into an array. Below is an example of the Array.of() method.

    let score1=100
    let score2=200
    let score3=300
    
    console.log(Array.of(score1, score2, score3)); //Output: [ 100, 200, 300 ]