Picture this: you're writing a program to store the marks of five students. Without arrays, you'd probably do something like this:
let marks1 = 88;
let marks2 = 74;
let marks3 = 91;
let marks4 = 65;
let marks5 = 79;
That works. But what if you had 50 students? Or 500? You'd be declaring variables all afternoon.
Arrays solve this by letting you store multiple values under a single name, in order.
What Is an Array?
An array is a collection of values stored in a sequence. Each value sits at a numbered position called an index, and you can access, update, or loop through those values without naming each one individually.
Here's the marks example rewritten with an array:
let marks = [88, 74, 91, 65, 79];
Five values, one variable. Much cleaner.
Arrays aren't just for numbers. You can store strings, booleans, or a mix of types:
let fruits = ["apple", "mango", "banana"];
let tasks = ["buy groceries", "call mom", "fix bug #42"];
How to Create an Array
The most common way is with square brackets:
let colors = ["red", "green", "blue"];
You can also create an empty array first and fill it later:
let scores = [];
Both are valid. Most of the time you'll use the bracket syntax.
Accessing Elements by Index
Every item in an array has an index, starting at 0. That's not a typo. JavaScript (like most languages) starts counting from zero.
let fruits = ["apple", "mango", "banana"];
console.log(fruits[0]); // "apple"
console.log(fruits[1]); // "mango"
console.log(fruits[2]); // "banana"
Think of it like a row of lockers. Locker 0 is the first one, locker 1 is the second, and so on.
If you try to access an index that doesn't exist, you get undefined:
console.log(fruits[5]); // undefined
No error, just a polite nothing.
Updating Elements
Accessing an element and updating one use the same index syntax, you just add an assignment:
let fruits = ["apple", "mango", "banana"];
fruits[1] = "grapes";
console.log(fruits); // ["apple", "grapes", "banana"]
"mango" is gone, replaced by "grapes". The rest of the array is untouched.
The length Property
Every array has a built-in length property that tells you how many elements it contains.
let tasks = ["buy groceries", "hit the gym", "fix bug #42"];
console.log(tasks.length); // 3
One thing to keep in mind: length is always one more than the last valid index. If an array has 3 items, the indices are 0, 1, and 2, but length is 3.
This comes up often when you want the last element:
let last = tasks[tasks.length - 1];
console.log(last); // "fix bug #42"
Looping Over an Array
Once your data is in an array, you'll usually want to go through each item. The classic way is a for loop:
let fruits = ["apple", "mango", "banana"];
for (let i = 0; i < fruits.length; i++) {
console.log(fruits[i]);
}
Output:
apple
mango
banana
The loop starts at index 0, runs as long as i is less than the length, and increments by 1 each time. This pattern covers most situations.
There's also for...of, which is cleaner when you only care about the values and not the index:
for (let fruit of fruits) {
console.log(fruit);
}
Same output, less noise. Use for...of when the index doesn't matter to you.
Putting It Together
Here's a small example that uses everything covered above:
let scores = [72, 85, 90, 61, 78];
console.log("Total students:", scores.length);
console.log("First score:", scores[0]);
console.log("Last score:", scores[scores.length - 1]);
scores[2] = 95; // update a score
for (let i = 0; i < scores.length; i++) {
console.log("Student", i + 1, "scored", scores[i]);
}
Run this in your browser console or a Node environment and you'll see exactly how each piece behaves.
Conclusion
Arrays are one of the most-used structures in JavaScript. Once you're comfortable with indexing and looping, a lot of other things start to make more sense. Methods like push, pop, filter, and map all build on this foundation, but those are for another day.
