JavaScript Arrays

An array in JavaScript is a special type of variable that can store multiple values in a single container. Think of it as a list or collection of items. Each item in an array is called an element, and each element has a position number called an index, starting from 0.

1️⃣ Creating an Array

You can create an array using square brackets [ ]:

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

• fruits is an array containing 3 elements.
• Index positions:
• fruits[0] → "Apple"
• fruits[1] → "Banana"
• fruits[2] → "Cherry"

2️⃣ Array Length

The length property tells you how many elements are in an array:

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

3️⃣ Accessing Elements

You can access array elements using their index:

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

• Index starts at 0
• The last element is at index length - 1

4️⃣ Modifying Elements

You can change, add, or remove elements:

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

// Modify element
fruits[1] = "Blueberry"; // Change "Banana" to "Blueberry"

// Add element at end
fruits.push("Mango");

// Remove last element
fruits.pop();

// Add element at beginning
fruits.unshift("Strawberry");

// Remove first element
fruits.shift();

console.log(fruits);

5️⃣ Looping Through an Array

Arrays are often processed using loops.

Using for loop

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

for(let i = 0; i < fruits.length; i++) {
  console.log("Fruit at index " + i + ": " + fruits[i]);
}

Using for...of loop (simpler)

for(let fruit of fruits) {
  console.log("Fruit: " + fruit);
}

Compilation of Entire Code

Explanation:

• Creates an array fruits
• Modifies and adds elements
• Displays array length
• Loops through each element using a for loop
• Updates the page dynamically