Arrays in Javascript

There are many type of data types like String, Numbers, Boolean. But these are not enough to represents data from real world problems individually. There is data which can be combination of these data types. To store this type of data, there is data structure named as Array and we gonna learn about it.

ARRAYS

JavaScript provides data type specially for storing sequences of values. It is called an array and is written as a list of values between square brackets, separated by commas.

let listOfNumbers = [2, 3, 5, 7, 11];
console.log(listOfNumbers[2]);
//  5
console.log(listOfNumbers[0]);
//  2
console.log(listOfNumbers[2 - 1]);
//  3

The notation for getting the elements of an array used square brackets. A pair of square brackets immediately after an expression, with another expression inside of them, will look up the element in the left-hand expression that corresponds to the index given by the expression in the brackets.

The JavaScript Array class is a global object that is used in the construction of arrays; which are high-level, list-like objects. Arrays are list-like objects whose prototype have methods to perform traversal and mutable operations. In javascript, length and type of elements are not fixed. If we check type of array, we will get it's type as object.

let fruits = ['orange','apple','mango'];
console.log(typeof fruits);
//  object

METHODS

Let's get familiar with some built-in array methods like indexOf(),includes,slice(),splice(),push(),pop(),shift(),unshift().

The indexOf() method returns the first index at which given element found in array.

let arr=[2,4,6,8,10];
console.log(arr.indexOf(6)); 
//  2

The includes() method returns true if given element found in array otherwise false.

let odd=[1, 3, 5, 7];
console.log(odd.includes(3));
//  true
let fruits = ['orange' , 'apple' , 'mango'];
console.log(fruits.includes('apple'));
//  true
console.log(fruits.includes('man'));
//  false

The concat() method used to merge two or more arrays.

let fruits=['🍊', '🍎', '🥭']; 
let arr=[2,4,6,8,10]; 
let newArray1 = arr.concat(fruits); 
console.log(newArray1); 
//  [2, 4, 6, 8, 10, '🍊', '🍎', '🥭'] 
let newArray2 = fruits.concat(['🍌','🍓']); 
console.log(newArray2); 
//  ['🍊', '🍎', '🥭','🍌','🍓']

The slice() method returns a copy of part of the array into a new array selected from start and end index of the array.Start index is inclusive and end index is exclusive.If end index not given then it slice the array till last element from start index ,if start and end both is not given then it create copy of whole array.

let junkFood=['🍕','🍔','🍟','🍧','🍫'];
const sliceArray = junkFood.slice(0,3);
const sliceLast=junkFood.slice(2);
const sliceWhole=junkFood.slice();
console.log(sliceArray);
//  ['🍕','🍔','🍟']
console.log(sliceLast);
//  ['🍟','🍧','🍫']
console.log(sliceWhole);
//  ['🍕','🍔','🍟','🍧','🍫']

The splice() method changes the contents of an array by removing or replacing elements or can add new elements. First argument is the index from which to start changing the array.Second argument indicates the number of elements which have to change from start. Remaining arguments are the elements which have to insert in the array.

let animals=['🐕','🐈','🐐','🐇'];
animals.splice(1,0,'🐒');
console.log(animals);
//  ['🐕','🐒','🐈','🐐','🐇']
animals.splice(3,1,'🐎');
console.log(animals);
//  ['🐕','🐒','🐈','🐎','🐇']

Note: concat() and slice() methods both returns new array, they do not mutate or change original array but splice() method change original one.

There are two methods puch() and pop() which makes array behave as stack in javascript. push() method insert elements in array at the end and pop() method remove element from end.

Similarly shift() and unshift() methods which makes array behave as queue data structure in javascript.shift() method removes the element from start of the array.The unshift() add one or more elements at the beginning of the array and returns the new length of the array.

let birds = ['🦜','🕊','🦆'];
birds.push('🐦');
console.log(birds);
//  ['🦜','🕊','🦆','🐦']

birds.push(['🦅','🦩']);
console.log(birds);
//  ['🦜','🕊','🦆','🐦',['🦅','🦩']]

birds.pop();
console.log(birds);
//  ['🦜','🕊','🦆','🐦']

birds.shift();
birds.shift();
console.log(birds);
//  ['🦜','🕊']

console.log(birds.unshift('🦩','🦚'));
// 4
console.log(birds);
//  ['🦩','🦚','🦜','🕊']