JavaScript Arrays 101
When writing programs, we often need to store multiple related values.
For example:
A list of fruits
Marks of students
Daily tasks
Favorite movies
If we store each value separately, our code quickly becomes messy.
let fruit1 = "Apple";
let fruit2 = "Banana";
let fruit3 = "Mango";
let fruit4 = "Orange";
Managing many variables like this is difficult.
JavaScript provides a better solution: Arrays.
Arrays allow us to store multiple values inside a single variable.
What Are Arrays?
An array is a collection of values stored in ordered positions.
Each value in an array is called an element.
Example:
let fruits = ["Apple", "Banana", "Mango", "Orange"];
Here:
fruitsis the array"Apple","Banana","Mango","Orange"are elementsElements are stored in a specific order
Arrays are useful when we need to group related data together.
How to Create an Array
In JavaScript, arrays are created using square brackets [].
Example:
let numbers = [10, 20, 30, 40];
Another example:
let tasks = ["Study", "Exercise", "Read", "Code"];
An array can store different types of values:
let mixedArray = ["Hello", 25, true];
However, usually arrays store similar types of data for clarity.
Accessing Elements Using Index
Each element in an array has a position called an index.
Important rule:
Array indexing starts from 0.
Example:
let fruits = ["Apple", "Banana", "Mango", "Orange"];
| Index | Value |
|---|---|
| 0 | Apple |
| 1 | Banana |
| 2 | Mango |
| 3 | Orange |
Access elements like this:
console.log(fruits[0]); // Apple
console.log(fruits[2]); // Mango
Updating Elements
We can update a value in an array by assigning a new value to its index.
Example:
let fruits = ["Apple", "Banana", "Mango"];
fruits[1] = "Orange";
console.log(fruits);
Output:
["Apple", "Orange", "Mango"]
Here we replaced Banana with Orange.
Array Length Property
JavaScript arrays have a built-in property called length.
It tells us how many elements are in the array.
Example:
let fruits = ["Apple", "Banana", "Mango", "Orange"];
console.log(fruits.length);
Output:
4
This means the array contains 4 elements.
Looping Through Arrays
Often we want to perform an action on every element in an array.
We can use a for loop.
Example:
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 length - 1.
Why Arrays Are Useful
Arrays help us:
Store multiple values in one variable
Keep related data organized
Process many values using loops
Instead of writing many variables, we can store everything in a single structured collection.
Assignment Idea
Try this small exercise:
1️⃣ Create an array of 5 favorite movies
Example:
let movies = ["Inception", "Interstellar", "Avengers", "Titanic", "Joker"];
2️⃣ Print the first and last movie
console.log(movies[0]);
console.log(movies[movies.length - 1]);
3️⃣ Change one movie
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]);
}