Understanding Arrays in JavaScript

Software developer writing to think clearly about code, systems, and real-world tradeoffs.
When writing programs, we often need to store multiple values together. Imagine you want to store a list of fruits, marks, or tasks. Writing separate variables for each value quickly becomes messy.
This is where arrays become useful.
What Is an Array?
An array is a collection of values stored in a single variable.
Instead of creating many variables like this:
let fruit1 = "Apple";
let fruit2 = "Banana";
let fruit3 = "Mango";
We can store everything in one structure:
let fruits = ["Apple", "Banana", "Mango"];
Now all values are stored together inside one array.
Think of an array like a numbered list.
[ Apple , Banana , Mango ]
0 1 2
Each value has a position number, called an index.
Why We Need Arrays
Arrays help us:
Store multiple related values in one place
Organize data in order
Easily loop through values
Reduce repetitive variables
Example: storing student marks.
Without arrays:
let mark1 = 80;
let mark2 = 75;
let mark3 = 90;
With arrays:
let marks = [80, 75, 90];
Much cleaner and easier to manage.
How to Create an Array
Arrays are created using square brackets [].
Example:
let fruits = ["Apple", "Banana", "Mango"];
Another example:
let numbers = [10, 20, 30, 40];
Arrays can store different types of values:
let mixed = ["Rahul", 25, true];
Accessing Elements Using Index
Every value in an array has a position called an index.
Important rule:
Array indexing starts from 0
Example:
let fruits = ["Apple", "Banana", "Mango"];
Access values like this:
console.log(fruits[0]);
console.log(fruits[1]);
console.log(fruits[2]);
Output:
Apple
Banana
Mango
Visual representation:
Index: 0 1 2
Value: [Apple , Banana , Mango]
Updating Elements in an Array
We can change values using their index.
Example:
let fruits = ["Apple", "Banana", "Mango"];
fruits[1] = "Orange";
console.log(fruits);
Output:
["Apple", "Orange", "Mango"]
Here we updated Banana → Orange.
Array length Property
The length property tells us how many elements are in the array.
Example:
let fruits = ["Apple", "Banana", "Mango"];
console.log(fruits.length);
Output:
3
This is useful when working with loops.
Looping Through an Array
Often we want to process every value in an array.
We can do this using a loop.
Example:
let fruits = ["Apple", "Banana", "Mango"];
for (let i = 0; i < fruits.length; i++) {
console.log(fruits[i]);
}
Output:
Apple
Banana
Mango
Execution flow:
Start loop
↓
i = 0 → Apple
↓
i = 1 → Banana
↓
i = 2 → Mango
↓
Loop ends
Visualizing Array Storage
Arrays store values in order.
Example:
Array Name: fruits
Index Value
----------------
0 Apple
1 Banana
2 Mango
3 Orange
Memory-style block diagram:
[0] Apple
[1] Banana
[2] Mango
[3] Orange
Each block stores one value.
Practice Assignment
Try the following exercises.
1. Create an array of 5 favorite movies
let movies = ["Inception", "Interstellar", "Avatar", "Titanic", "Joker"];
2. Print the first and last element
console.log(movies[0]);
console.log(movies[movies.length - 1]);
3. Change one value
movies[2] = "The Dark Knight";
console.log(movies);
4. Loop through the array
for (let i = 0; i < movies.length; i++) {
console.log(movies[i]);
}
Final Takeaway
Arrays are one of the most important structures in JavaScript.
Remember these core ideas:
Array = collection of ordered values
Index starts from 0
Use [] to create arrays
Use index to access or update values
Use length to know total items
Loops help process all elements
Once you understand arrays, you will be able to handle lists of data such as users, products, tasks, and much more in real applications.



