Home Tutorials Videos Q&A MCQ Shortcuts Exercises Appointment Login
Lesson 16 of 30 – JavaScript Arrays
50%

JavaScript Arrays

A JavaScript array is a special variable that can store multiple values in a single variable.

Note: Arrays can store numbers, strings, booleans, objects, and even other arrays.
What is an Array?

Normally, a variable stores one value.

An array stores multiple values using square brackets [].

Example:
let numArr = [10,11,12,13,14];

This array contains five elements.

Creating Arrays

Arrays can be created in two ways.

1. Array Literal
let arr=[10,20,30,40];
2. Array Constructor
let arr=new Array(10,20,30,40);

The literal method is recommended.

Different Types of Arrays
let stringArray=["one","two","three"];

let numericArray=[1,2,3,4];

let decimalArray=[1.1,1.2,1.3];

let booleanArray=[true,false,true];

Arrays can contain different data types.

let data=[1,"Raushan","Kumar",true,25550,5.5];
Array Length

Use the length property to get the total number of elements.

let cities=["India","Pak","Japan","New Delhi"];

console.log(cities.length);

cities[4]="Delhi";

console.log(cities.length);

The length changes automatically.

Access Array Elements

Array indexing starts from 0.

let numArr=[10,20,30,40,50];

console.log(numArr[0]);
console.log(numArr[1]);
console.log(numArr[2]);

Accessing an invalid index returns undefined.

Using at() Method

The at() method accesses elements by index.

Negative indexes access elements from the end.

let numArr=[10,20,30,40,50];

console.log(numArr.at(0));
console.log(numArr.at(-1));
console.log(numArr.at(-2));
Loop Through Arrays

Arrays can be traversed using different loops.

numArr.forEach(i=>console.log(i));

for(let i=0;i console.log(numArr[i]);

for(let i of numArr)
console.log(i);
Update Array Elements

You can update an array element by specifying its index.

Example:
let cities = ["Mumbai","New York","Paris","Sydney"];

cities[0]="Delhi";
cities[1]="Los Angeles";

console.log(cities);

The existing values are replaced with new values.

Adding New Elements

New elements can be added by assigning values to a new index.

let cities=["Mumbai","New York","Paris","Sydney"];

cities[4]="Delhi";

cities[cities.length]="London";

Using cities.length automatically adds an element at the end.

push() Method

The push() method adds one or more elements at the end of an array.

let cities=["Mumbai","New York","Paris"];

cities.push("Delhi");

console.log(cities);

push() is the recommended way to add elements at the end.

unshift() Method

The unshift() method adds elements at the beginning of an array.

let cities=["Mumbai","New York","Paris"];

cities.unshift("Delhi");

cities.unshift("London","Pune");

Multiple elements can also be added.

Remove Last Element

The pop() method removes and returns the last element.

let cities=["Mumbai","New York","Paris","Sydney"];

let removedCity=cities.pop();

console.log(cities);
Remove First Element

The shift() method removes the first element.

let cities=["Mumbai","New York","Paris","Sydney"];

let removedCity=cities.shift();

console.log(cities);
Remove Middle Elements

JavaScript does not directly remove a middle element by value.

The filter() method creates a new array.

let cities=["Mumbai","New York","Paris","Sydney"];

let cityToRemove="Paris";

let newCities=cities.filter(function(item){
return item!==cityToRemove;
});

console.log(newCities);
Common Array Operations
Operation Method
Find Size length
Add at End push()
Add at Beginning unshift()
Remove Last pop()
Remove First shift()
Access Element [] or at()
Loop Elements for, forEach, for...of
Best Practices
  • Use array literals whenever possible.
  • Use push() to add elements at the end.
  • Use unshift() to add elements at the beginning.
  • Use pop() and shift() for removing elements.
  • Use length property to get array size.
  • Use forEach() or for...of for iteration.
  • Avoid assigning values to very large indexes unnecessarily.
  • Store related data together in arrays.
Advantages of Arrays
  • Store multiple values in one variable.
  • Easy to access data using indexes.
  • Support different data types.
  • Simple to add and remove elements.
  • Useful for loops and data processing.
  • Provide many built-in methods.
Key Points
  • Arrays store multiple values.
  • Array indexes start from 0.
  • Use [] or at() to access elements.
  • Use length to find array size.
  • Use push() and unshift() to add elements.
  • Use pop() and shift() to remove elements.
  • Arrays can contain mixed data types.
  • Arrays can be traversed using loops.
Quick Revision
Method Purpose
length Array size
push() Add at end
pop() Remove last
unshift() Add at beginning
shift() Remove first
at() Access element
forEach() Loop through array

🧠 Quick Quiz

Which method adds a new element at the end of an array?



← Previous Next →