Array in JavaScript

In this post we are going to understand arrays in JavaScript with the help of examples, methods of an array, how to create an array and access elements, add elements/remove elements from an array.

What is array in JavaScript?


An array is an object type in Javascript that is used to store multiple elements of any data type(string, number, float, decimal) in a single variable. Each element of the array is correlated with a numeric index. The Index of the array’s first element is starting with 0. We often use an index to access the elements of an array.

1. How to create an array in JS


1. Array constructor

In this approach, we create an array object using a new keyword. It is not recommended approach.

//array constructor to create a new array
let myarray = new Array();

//array if we know the size of array
let myarray = new Array(10);

//create new array by passing elements
let myarray = new Array('A','B','C');

2. Array literal notation


The second way to create an array is by using an array literal notation. In practice, we use an array literal notation to create an array.

//array literal notation literal notation
let myarray = [];

2. Add single/multiple elements in Array


We can add elements to an array using an array. push() to add elements at end of the array and unshift() to add elements at end of the array.

Add single or multiple item at end of Array

Array.push() :Add single or multiple elements at end of array.

let students = [ 'Rack','Phys', 100];


//append a single new element end of an array

students.push('max');


console.log('add single item:',students)

let names = ['Tax','mack']

students.push(...names)

console.log('\n add mutiple elements  :',students)


Output

add single item: [ 'Rack', 'Phys', 100, 'max' ]

 add mutiple elements  : [ 'Rack', 'Phys', 100, 'max', 'Tax', 'mack' ]

Add single or multiple item at beginning of Array

unshift(): Add single or multiple elements at beginning of the array

let students = [ 'Rack','Tom'];


//add a single new element start of an array

students.unshift('max');


console.log(students)


let names = ['Tax','mack']
//add mutiple element at begging of array
students.unshift(...names)



console.log("append elements using spread operator:\n",students)

Output

[ 'max', 'Rack', 'Tom' ]
spread to add mutiple elements:
 [ 'Tax', 'mack', 'max', 'Rack', 'Tom' ]

Splice() to Add element at any Position

The splice() method changes the contents of the array by adding new elements or removing existing ones.

Syntax

array.splice(startIndex,no_of_element,element1,element2,....,elementn)

Parameters

  • startIndex: required parameter-specific start index to add or remove elements.
  • no_of_elements: optional parameter number of elements to remove or add.
  • element1,element2,….,elementN: optional parameter the new elements add to array.

Example add elements at postion in array

let students = [ 'Rack','Tom',
 'Max'];


students.splice(3,2,'Jack','Hans','dev')




console.log(students)

//output
[ 'Rack', 'Tom', 'Max', 'Jack', 'Hans', 'dev' ]

3. Get length of array


The length property is used to find the length of an array in javascript.

Example

let students = [ 'Rack','Tom',
 'Max','Kon','Unix','Avi'];

console.log(students.length)

//Output
6

4. Remove element from an array


We will understand how to remove elements at the end/start at any position in the array.

Remove element at end of array

Array.pop() : its remove last element from an array.

let students = [ 'Rack','Tom',
 'Max'];
students.pop()
console.log(students) 

//output
[ 'Rack', 'Tom' ]

Remove element at beginning of array

Array.shift() :its remove first element of an array.

Example

let students = [ 'Rack','Tom',
 'Max'];
students.shift()
console.log(students)
//output
[ 'Tom', 'Max' ]

Remove element at any postion

Array.splice() :-Array splice remove or insert elements at specific position.

Example

let students = [ 'Rack','Tom',
 'Max'];
students.splice(0,2)
console.log(students)

//output
['Max']

Some Useful method of array


5. Access elements of array


Each element of the array is correlated with a numeric index. The Index of the array’s first element is starting with 0. so we can use the index to access the elements of an array.

Syntax

var ele = arrayname[index]

Examples :Access single element of array

let students = [ 'Rack','Tom',
 'Max'];
console.log(students[0])

//output
Rack

6. slice an array in JavaScript


The array.slice() method returns a new array of selected elements based on the start and ends index from the original array. It does not change the original array else returns the new array.

Syntax

array.slice(startindex,endindex)

Parameters

  • startindex : The index at which the extraction or slicing of array start. .The defult value is 0.
  • EndIndex: An intege value specify where to end selection slicing or extraction.It default value is array.length.The negative endindex extract element from end.

Example

let students = [ 'Rack','Tom',
 'Max','Kon','Unix','Avi'];
subarray  = students.slice(0,3)
console.log(subarray)

//Output
[ 'Rack', 'Tom', 'Max' ]


//negative end index
subarray1  = students.slice(1,-2)
console.log(subarray1)

//Output
[ 'Tom', 'Max', 'Kon' ]

7. How to Check value is array


To check the value in the array we can use this instanceof operator and isArray() method.

instanceof: The instanceof operator return true when value is array type else returns false.

Example

let students = [ 'Rack','Tom',
 'Max','Kon','Unix','Avi'];
console.log(students instanceof Array)

//output
true

isArray() : It returns true when value is array type else returns false.

Example

let students = [ 'Rack','Tom',
 'Max','Kon','Unix','Avi'];
console.log(Array.isArray(students))


//output
true

Summary

In this post, we have understood the array in Javascript with examples.