JavaScript-Blog 6

We will learn about

• Array
• Array Methods

Array

Array is a data structure that allows you to store and organize multiple values within a single variable.

In JavaScript, arrays aren’t primitives but are instead objects. Commonly we use arrays to store same type of data.

• Array Element: Each value within an array is called an element. Elements are accessed by their index.
• Array Index: A numeric representation that indicates the position of an element in the array. JavaScript arrays are zero-indexed, meaning the first element of an array is at index 0, the second is at index 1, and so on — and the last element is at the value of the array’s length property minus 1.
• Array Length: The number of elements in an array. It can be retrieved using the length property.

Suppose we need to record the marks of 5 students. Instead of creating 5 separate variables, we can simply create an array:

let marks = [67,75,91,46,55];
console.log(marks);

Output:

(5) [67, 75, 91, 46, 55]
0 : 67                     --> element at index 0/1st positon
1 : 75                     --> element at index 1/2nd positon
2 : 91                     --> element at index 2/3rd positon
3 : 46                     --> element at index 3/4th positon
4 : 55                     --> element at index 4/5th positon
length : 5                 --> length of array

Accessing Array Elements

We access an array element by referring to the index number.

let marks = [67,75,91,46,55];
console.log(marks[0]);        // element at first position
console.log(marks[1]);        // element at second position
console.log(marks[4]);        // element at last position

Output:

67
75
55

Modifying the Array Elements

Elements in an array can be modified by assigning a new value to their corresponding index.

Arrays are mutable in Js. This means we can change an array.

let marks = [67,75,91,46,55];
marks[0] = 100;        //changing value at first position
console.log(marks);

Output:

[100, 75, 91, 46, 55]

Looping over an array

What if our array has hundreds of element and we have to display each one of them. One way to do this is

console.log(marks[0]);
console.log(marks[1]);
console.log(marks[2]);
.       .       .
.       .       .
.       .       .
console.log(marks[n]);

This method is too long and time consuming. Best way is to iterate over the array with the help of loop. We can use every loop to achieve this. for…in and for…of loop are value-based because they use value of every element in array. Rest of the loops are index-based. They operate on indices.

for…of loop

let marks = [67,75,91,46,55];
for (let val of marks){
    console.log(val);
}

Output:

67
75
91
46
55

for loop

let marks = [67,75,91,46,55];
for (let i = 0; i < marks.length; i++){
    console.log(marks[i]);
}

Output:

67
75
91
46
55

Array Methods

There are many array methods. Some are given below

Name	Description
push()	Adds new elements to the end of an array, and returns the new length
pop()	Removes the last element of an array, and returns that element
toString()	Converts an array to a string, and returns the result
concat()	Joins arrays and returns an array with the joined arrays
unshift()	Adds new elements to the beginning of an array, and returns the new length
shift()	Removes the first element of an array, and returns that element
slice()	Selects a part of an array, and returns the new array
splice()	Adds/Removes/Replace elements from an array