Converting Arrays to Strings

The JavaScript method toString() converts an array to a string of (comma separated) array values.

Example:

const Avengers = ["Iron Man", "Thor", "Falcon"];

document.getElementById("demo").innerHTML = Avengers.toString();

The join() method also joins all array elements into a string.

It behaves just like toString(), but in addition you can specify the separator:

Example:

const Avengers = ["Iron Man", "Thor", "Falcon"];

document.getElementById("demo").innerHTML = Avengers.join(" * ");

EXAMPLE ❯


Popping and Pushing

When you work with arrays, it is easy to remove elements and add new elements.

This is what popping and pushing is:

Popping items out of an array, or pushing items into an array.


Popping

Remove an item from the end of an array

pop() returns the removed item.

EXAMPLE ❯


Pushing

Add items to the end of an array

push() returns the new array length.

EXAMPLE ❯


Shifting Elements

shift()

Remove an item from the beginning of an array

shift() returns the removed item.

Example:

let cats = ['Bob', 'Willy', 'Mini'];

cats.shift(); // ['Willy', 'Mini']

 

unshift()

Add items to the beginning of an array

unshift() returns the new array length.

Example:

let cats = ['Bob'];

cats.unshift('Willy'); // ['Willy', 'Bob']

cats.unshift('Puff', 'George'); // ['Puff', 'George', 'Willy', 'Bob']


Changing Elements

Array elements are accessed using their index number:

Array indexes start with 0:

[0] is the first array element, [1] is the second, [2] is the third ...


Length Property

The length property provides an easy way to append a new element to an array:

EXAMPLE ❯


Deleting Elements

Since JavaScript arrays are objects, elements can be deleted by using the JavaScript operator delete.

Using delete may leave undefined holes in the array. Use pop() or shift() instead.


Using splice() to Remove Elements

The splice() method can be used to add new items to an array:

This method is used to modify the contents of an array by removing the existing elements and/or by adding new elements. 

Use the indexing of splice method to remove elements from a JavaScript array. 

EXAMPLE ❯


Merging (Concatenating) Arrays

The concat() method creates a new array by merging (concatenating) existing arrays

The concat() method can take any number of array arguments

The concat() method does not change the existing arrays. It always returns a new array.

EXAMPLE ❯


Slicing an Array

The arr.slice() method returns a new array containing a portion of the array on which it is implemented. The original remains unchanged.

Syntax:

arr.slice(begin, end)

Attribute description:

     begin: This parameter defines the starting index from where the portion is to be extracted. If this argument is missing then the method takes begin as 0 as it is the default start value.

     end: This parameter is the index up to which the portion is to be extracted (excluding the end index). If this argument is not defined then the array till the end is extracted as it is the default end value If the end value is greater than the length of the array, then the end value changes to length of the array.

 

Below is the example of Array slice() method:

 

const Avengers = ["Iron Man", "Thor", "Falcon"];

const movie = Avengers .slice(1);

 

The slice() method creates a new array. It does not remove any elements from the source array.

EXAMPLE ❯