A JavaScript array is an object type that can store multiple values in an ordered list.

  • Arrays are zero-indexed.
  • Can store different types of data: numbers, strings, objects, other arrays, etc.
  • Arrays are dynamic (length can change).
let arr = [1, "hello", true, { name: "Alice" }, [1, 2]];
console.log(arr[3].name); // Alice
console.log(arr[4][0]);  // 1

🔹 Note: Arrays in JS are objects, but with special behavior for indexing and length.

1. Creating Arrays

1.1 Array Literal

An array literal is the simplest and most common way to create an array using square brackets [].

Syntax:

let arrayName = [element1, element2, element3, ...];

Examples:

// Array of numbers
let numbers = [1, 2, 3, 4, 5];

// Array of strings
let fruits = ["Apple", "Banana", "Mango"];

// Array of mixed types
let mixedArray = [1, "Hello", true, null, { name: "Alice" }, [1,2]];

console.log(numbers);       // [1, 2, 3, 4, 5]
console.log(fruits[1]);     // Banana
console.log(mixedArray[4]); // { name: "Alice" }

Characteristics:

  1. Simple & readable – ideal for most use cases.

  2. Can contain any type of value, including other arrays (nested arrays).

  3. Length automatically adjusts when elements are added or removed.

Adding/Removing with Array Literal:

let fruits = ["Apple", "Banana"];
fruits.push("Mango");   // Add to end
fruits.unshift("Kiwi"); // Add to start
fruits.pop();            // Remove last element
fruits.shift();          // Remove first element

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

✅ Recommended: Use Array Literal unless you have a very specific reason to use the constructor.

1.2 Array Constructor

JavaScript provides an Array constructor (new Array()) to create arrays.

Syntax:

let arrayName = new Array(element1, element2, ...);

Examples:

// Array of numbers
let numbers = new Array(1, 2, 3, 4);
console.log(numbers); // [1, 2, 3, 4]

// Array of strings
let fruits = new Array("Apple", "Banana");
console.log(fruits[0]); // Apple

Edge Case (Important!):

  • Single numeric argument is treated as array length, not an element.

let arr = new Array(5);
console.log(arr);        // [ <5 empty items> ]
console.log(arr.length); // 5

  • If you pass more than one number, it creates an array of those numbers:

let arr = new Array(1, 2, 3);
console.log(arr); // [1, 2, 3]

Characteristics:

  1. Can create arrays with predefined length.
  2. Can lead to confusing behavior if a single number is passed.
  3. Less readable compared to literals.

Adding elements later:

let arr = new Array(3); // creates array with length 3
arr[0] = "A";
arr[1] = "B";
arr[2] = "C";

console.log(arr); // [“A”, “B”, “C”]

2. Accessing Array Elements

Arrays are zero-indexed, meaning the first element is at index 0.

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

Access by Index

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

Access Last Element

console.log(fruits[fruits.length - 1]); // Mango

3. Modifying Array Elements

You can change existing elements by referencing their index.

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

Adding New Element at a Specific Index

fruits[3] = "Pineapple";
console.log(fruits); // ["Apple", "Orange", "Mango", "Pineapple"]

Using push() and unshift() to Add

fruits.push("Grapes");     // Add at end
fruits.unshift("Strawberry"); // Add at start
console.log(fruits);
// ["Strawberry", "Apple", "Orange", "Mango", "Pineapple", "Grapes"]

Removing Elements

  • pop() – removes last element
fruits.pop();
  • shift() – removes first element
fruits.shift();

4. Array Length

The length property gives the number of elements in the array.

const numbers = [1, 2, 3, 4, 5];
console.log(numbers.length); // 5

Modify Length

You can truncate or expand an array by changing its length.

numbers.length = 3;
console.log(numbers); // [1, 2, 3]

numbers.length = 5;
console.log(numbers); // [1, 2, 3, <2 empty items>]

⚠ Expanding length adds empty slots, not undefined values.

5. Looping Through Array Elements

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

Or using for...of:

for (const fruit of fruits) {
  console.log(fruit);
}

Categorized in:

Javascript,