ARRAYS

Array

Array is a variable where we can store more than one value. JavaScript arrays can store any valid value, including strings, numbers, objects, functions, and even other arrays.

Syntax

var myArray = [element0, element1, ..., elementN]

Example :

var fruits = ["Apple", "Banana", "Mango", "Orange", "Papaya"];

Accessing the Elements of an Array

Array elements can be accessed by their index using the square bracket notation. Array indexes are zero-based. This means that the first item of an array is stored at index 0 and goes up to index n-1(where n is number of elements in an array).

Example :

var fruits = ["Apple", "Banana", "Mango", "Orange", "Papaya"];
console.log(fruits[0]); // Prints: Apple
console.log(fruits[1]); // Prints: Banana

Getting the Length of an Array

The length property returns the length of an array, which is the total number of elements contained in the array.

Example :

var fruits = ["Apple", "Banana", "Mango", "Orange", "Papaya"];
console.log(fruits.length); // Prints: 5

Adding New Elements to an Array

To add a new element at the end of an array, use the push() method.

Example :

var colors = ["Red", "Green", "Blue"];
colors.push("Yellow");
console.log(colors); // Prints: Red,Green,Blue,Yellow

To add a new element at the beginning of an array, use theunshift() method.

Example :

var colors = ["Red", "Green", "Blue"];
colors.unshift("Yellow");
console.log(colors); // Prints: Yellow,Red,Green,Blue

Removing Elements from an Array

To remove the last element from an array, use the pop() method.

Example :

var colors = ["Red", "Green", "Blue"];
colors.pop();
console.log(colors); // Prints: ["Red", "Green"]

remove the first element from an array use the shift() method.

var colors = ["Red", "Green", "Blue"];
colors.shift();
console.log(colors); // Prints: ["Green", "Blue"]

Adding or Removing Elements at Any Position

To add or remove elements from any index, use the splice() method. The splice() method returns array of deleted elements.The original array will be modified.

Syntax

arr.splice(startIndex, deleteCount, "elem1", ..., "elemN")

The first parameter (startIndex) defines the position where new elements should be added (spliced in).

The second parameter (deleteCount) defines how many elements should be removed.

The rest of the parameters (“elem1” ,…., “elemN”) define the new elements to be added.

Example :

var colors = ["Red", "Green", "Blue"];
// Deleting elements
colors.splice(0, 1);
console.log(colors); // Prints: ["Green", "Blue"]
//Adding elements at position one
colors.splice(1, 0, "Yellow", "Pink");
console.log(colors); // Prints: ["Green", "Yellow", "Pink", "Blue"]
//Insert two values, remove one
colors.splice(1, 1, "Purple", "Violet");
console.log(colors); // Prints: ["Green", "Purple", "Violet", "Pink", "Blue"]

Creating a String from an Array

To create a string by joining the elements of an array, use thetoString() method or join() method. The join() method takes an optional parameter which is a separator string that is added in between each element.

Example :

var colors = ["Red", "Green", "Blue"];
//Using toString() method
console.log(colors.toString()); // Prints: Red,Green,Blue
//Using join() method
console.log(colors.join()); // Prints: Red,Green,Blue
console.log(colors.join("")); // Prints: RedGreenBlue
console.log(colors.join("-")); // Prints: Red-Green-Blue
console.log(colors.join(", ")); // Prints: Red, Green, Blue

Extracting a Portion of an Array

To extract a portion of an array, use slice() method. The slice() method returns an new array object selected from start to end. The original array will not be modified.

Syntax

arr.slice(startIndex, endIndex)

Example :

var fruits = ["Apple", "Banana", "Mango", "Orange", "Papaya"];
var newArr = fruits.slice(1, 3);
console.log(newArr); // Prints: ["Banana", "Mango"]

Merging Two or More Arrays

The concat() method can be used to merge or combine two or more arrays. This method does not change the existing arrays, instead it returns a new array.

Example :

var color1 = ["Red", "Green", "Blue"];
var color2 = ["White", "Orange"];
var colors = color1.concat(color2);
console.log(colors); // Prints: ["Red", "Green", "Blue", "White", "Orange"]