JavaScript Arrays 101: Understanding the Basics

When I first started learning JavaScript, I often faced situations where I needed to store multiple values. At first, I tried storing each value in a separate variable, but that quickly became messy.

That’s when I learned about arrays.

Arrays make it easy to store and manage multiple values in a single place.

Let’s understand arrays step by step.

What Are Arrays and Why Do We Need Them?

An array is a collection of values stored in a single variable.

Instead of writing many variables like this:

let fruit1 = "Apple";
let fruit2 = "Banana";
let fruit3 = "Mango";

I can simply store them in an array:

let fruits = ["Apple", "Banana", "Mango"];

Now all values are stored in one variable, which makes the code cleaner and easier to manage.

Arrays are useful when working with:

• A list of fruits

• Student marks

• Tasks in a to-do list

• Names of users

Basically, whenever multiple related values need to be stored together.

How to Create an Array

In JavaScript, arrays are created using square brackets [].

Example:

let fruits = ["Apple", "Banana", "Mango"];

Another example:

let marks = [85, 90, 78, 92];

Here:

• fruits stores fruit names

• marks stores numbers

Arrays can store strings, numbers, or even mixed values.

Accessing Elements Using Index

Every element in an array has a position number called an index.

Important rule:

Array indexing starts from 0.

Example:

let fruits = ["Apple", "Banana", "Mango"];

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

Output:

Apple
Banana
Mango

Index structure looks like this:

Index:   0        1        2
Value: Apple   Banana   Mango

So if I want the first element, I use index 0.

Updating Elements in an Array

I can also change values inside an array using the index.

Example:

let fruits = ["Apple", "Banana", "Mango"];

fruits[1] = "Orange";

console.log(fruits);

Output:

["Apple", "Orange", "Mango"]

Here I replaced Banana with Orange.

Array Length Property

JavaScript arrays have a special property called length.

It tells how many elements exist in the array.

Example:

let fruits = ["Apple", "Banana", "Mango"];

console.log(fruits.length);

Output:

3

So the array contains 3 elements.

Looping Through an Array

Sometimes I want to print all elements of an array.

Instead of writing console.log() again and again, I can use a loop.

Example using a for loop:

let fruits = ["Apple", "Banana", "Mango", "Orange"];

for (let i = 0; i < fruits.length; i++) {
    console.log(fruits[i]);
}

Output:

Apple
Banana
Mango
Orange

The loop runs from index 0 to the last index of the array.

Why Arrays Are Better Than Multiple Variables

Without arrays:

let task1 = "Study";
let task2 = "Exercise";
let task3 = "Read";

With arrays:

let tasks = ["Study", "Exercise", "Read"];

Benefits:

• Cleaner code

• Easy to manage values

• Easy to loop through data

• Better for large lists

Assignment Practice

To practice arrays, try this small task.

Task

1. Create an array of 5 favorite movies

2. Print the first movie

3. Print the last movie

4. Change one movie name

5. Loop through the array and print all movies

Example start:

let movies = ["Inception", "Avatar", "Interstellar", "Titanic", "Joker"];

Try solving the rest yourself.

Conclusions:-

Arrays are one of the most important concepts in JavaScript. Almost every real-world program uses arrays to store and manage data.

Once the basics are clear, it becomes much easier to learn advanced array methods later.

If I understand arrays well, many JavaScript concepts become easier to learn.