Back

JavaScript Arrays 101

JavaScript
Veeshal D. Bodosa
15 Mar 2026
JavaScript Arrays

Imagine you want to store a list of your favorite fruits, exam marks, or daily tasks. You could create separate variables for each one, but that becomes messy very quickly. Arrays solve this problem by letting you store multiple values together in a single variable.

In JavaScript, an array is an ordered collection of values. That means every item has a position, and we can access items using that position number, called an index.

1. What Arrays Are and Why We Need Them

An array stores multiple values in order inside one variable.

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

The code above works, but it is not very practical when the list gets longer.

let fruits = ["Apple", "Banana", "Mango"]; console.log(fruits);

This is easier to manage because all related values are grouped together in one place.

2. How to Create an Array

You create an array using square brackets [ ] and separate items with commas.

let fruits = ["Apple", "Banana", "Mango"]; let marks = [78, 85, 92]; let tasks = ["Study", "Code", "Sleep"];

Arrays can hold strings, numbers, booleans, and more. For beginners, just remember that an array is a collection of values stored in order.

flowchart LR A["fruits array"] --> B["0: Apple"] A --> C["1: Banana"] A --> D["2: Mango"]

3. Accessing Elements Using Index

Every value in an array has an index, and indexing starts from 0, not 1.

let fruits = ["Apple", "Banana", "Mango"]; console.log(fruits[0]); console.log(fruits[1]); console.log(fruits[2]); // Apple // Banana // Mango

This means:

  • first element is at index 0
  • second element is at index 1
  • third element is at index 2
flowchart TD A["Index 0"] --> B["Apple"] C["Index 1"] --> D["Banana"] E["Index 2"] --> F["Mango"]

4. Updating Elements

You can change an array value by using its index.

let fruits = ["Apple", "Banana", "Mango"]; fruits[1] = "Orange"; console.log(fruits); // ["Apple", "Orange", "Mango"]

Here, the value at index 1 changed from "Banana" to "Orange".

5. Array length Property

The length property tells you how many elements are in the array.

let fruits = ["Apple", "Banana", "Mango"]; console.log(fruits.length); // 3

This is very useful when looping through arrays or finding the last element.

let fruits = ["Apple", "Banana", "Mango"]; console.log(fruits[fruits.length - 1]); // Mango

6. Basic Looping Over Arrays

A simple way to print all elements of an array is using a for loop.

let fruits = ["Apple", "Banana", "Mango"]; for (let i = 0; i < fruits.length; i++) { console.log(fruits[i]); }

Step by step:

  • i = 0 starts at the first element
  • i < fruits.length keeps the loop inside array boundaries
  • i++ moves to the next index each time

This prints every value in order.

7. Practice Assignment

Try this in your browser console:

let movies = ["Interstellar", "Inception", "3 Idiots", "The Dark Knight", "Zindagi Na Milegi Dobara"]; console.log("First movie:", movies[0]); console.log("Last movie:", movies[movies.length - 1]); movies[2] = "PK"; console.log("Updated array:", movies); for (let i = 0; i < movies.length; i++) { console.log(movies[i]); }

This assignment helps you practice:

  • creating an array
  • accessing the first and last element
  • changing one value
  • looping through all elements

Conclusion

Arrays are one of the most useful basics in JavaScript. They let you store multiple values in one place, access them using indexes, update values when needed, check length, and loop through the whole collection.

Keep the mental model simple: an array is an ordered list of values, and indexing starts from 0. Once this becomes natural, working with JavaScript data gets much easier.

fall back?

redesign..!